javascript - 如何使用 jquery 设置提醒?
问题描述
在数据库中,有 project_details 表。我正在从数据库中获取数据,结果如下所示;
重复开始日期在数据库表中,但我没有在数据库中保存结束日期。结束日期取决于用户从字段中选择的内容(从日期和到日期)
{
"projectremindshow":[
{
"project_ID":"8",
"project_title":"abc",
"period_type":"Yearly",
"recurrence_date":"2021-10-28",
"reminder_set_days":"12",
"recur_every":"2",
"start_date":"2021-09-28"
},
{
"project_ID":"10",
"project_title":"xyz",
"period_type":"Yearly",
"recurrence_date":"2021-10-05",
"reminder_set_days":"13",
"recur_every":"4",
"start_date":"2021-09-05"
},
{
"project_ID":"11",
"project_title":"mno",
"period_type":"Monthly",
"recurrence_date":"2021-10-01",
"reminder_set_days":"10",
"recur_every":"8",
"start_date":"2021-09-21"
}
]
}
const inputList = [
{
date: new Date("2021-01-01"),
date2: new Date(todate_recu_view),
daysBefore: reminder_set_days,
period: period_type,
skip: recur_every
}]
const frequencyList = inputList.map((el, index) => {
return getPaymentPlan(el)
})
如何将每个 for 循环值传递给 inputList?
从这些项目列表中,我想找出一个月或一周或一年的提醒日期,就像用户选择从和到日期选项来选择日期期间一样。
基于上面的 JSON,我想显示一个包含所有提醒日期的 HTML 表格。
我有两个字段从和到日期和搜索按钮。单击搜索按钮结果表将显示。
期望输出示例 1 是 如果用户选择 from-date= 2021-01-01 和 to_date=2026-01-30 并显示如下结果 Html 表格看起来有两列,如下所示:
project Title reminderdate
abc 2021-09-28 /*show from start_date value from json and recur every 2 years (count upto to_date=2026-01-30) */
abc 2023-09-28 /*recur every 2 years*/
abc 2025-09-28 /*recur every 2 years*/
xyz 2021-09-05 /*recur every 4 years*/
xyz 2025-09-05 /*recur every 4 years*/
mno 2021-09-21 /*recur every 8 months*/
mno 2022-05-21 /*recur every 8 months*/
mno 2023-01-21 /*recur every 8 months*/
mno 2023-09-21 /*recur every 8 months*/
mno 2024-05-21 /*recur every 8 months*/
mno 2025-01-21 /*recur every 8 months*/
mno 2025-09-21 /*recur every 8 months becoz user select to_date=2026-01-30*/
期望输出 example2 是
如果假设用户选择 from-date= 2025-01-01 和 to_date=2026-01-30 并显示如下结果
project Title reminderdate
abc 2025-09-28 /*recur every 2 years*/
xyz 2025-09-05 /*recur every 4 years*/
mno 2025-01-21 /*recur every 8 months*/
mno 2025-09-21 /*recur every 8 months*/
谁能帮我做到这一点?
我试过的代码:
$('#find_recurrence').click(function(event) {
var getID_comp = $('#getID_comp').val();
var fromdate_recu_view = $('#fromdate_recu_view').val(); //2025-01-01
var todate_recu_view = $('#todate_recu_view').val(); //2026-01-30
$.ajax({
url: base_url + "index.php/welcome/list_all_projects_reminder/",
type: "POST",
data: {
"company_id": getID_comp
},
success: function(data) {
var new_data = JSON.parse(data);
console.log(new_data) //above mentioned JSON result
for (var i = 0; i < new_data.projectremindshow.length; i++) {
var sl = i + 1;
var project_ID = new_data.projectremindshow[i].project_ID;
var project_title = new_data.projectremindshow[i].project_title;
var recur_every = new_data.projectremindshow[i].recur_every;
var period_type = new_data.projectremindshow[i].period_type;
var reminder_set_days = new_data.projectremindshow[i].reminder_set_days;
const getPaymentPlan = ({
date,
date2,
daysBefore,
period,
skip
}) => {
const originalDate = new Date(date.getTime()); // original copy before mutating
const startDate = new Date(date.setDate(date.getDate() - daysBefore))
// date has been mutated. giving it previous value
date = new Date(originalDate.getTime())
const recurObj = {
"recurrenceList": []
}
while (startDate.getTime() <= date2.getTime()) {
recurObj.recurrenceList.push(startDate.toISOString().split('T')[0])
switch (period) {
case 'monthly':
startDate.setMonth(startDate.getMonth() + skip)
break;
case 'yearly':
startDate.setFullYear(startDate.getFullYear() + skip)
break;
default:
recurObj.recurrenceList.push("wrong period type is given")
break;
}
}
return recurObj
}
const inputList = [{
date: new Date("2021-01-01"),
date2: new Date(todate_recu_view),
daysBefore: reminder_set_days,
period: period_type,
skip: recur_every
}]
const frequencyList = inputList.map((el, index) => {
return getPaymentPlan(el)
})
console.log(frequencyList)
}
}
});
});
解决方案
尽管您还没有超越将 AJAX 的结果分配到数组中的点(因为您inputList
在循环之外for
,没有定义或循环值),但最后还有很多其他小问题代码,尤其是在getPaymentPlan
函数内部,不可能在这里全部列出。相反,我只是提供一个工作版本供您学习和学习。
此外,您在问题中所述的预期结果也不正确 - 您已要求它显示提醒日期,但您列出的是重复日期。所有提醒日期均提前几天(由reminder_set_days
酒店控制)。
我的演示产生的结果显示了实际的提醒日期:
$('#find_recurrence').click(function(event) {
var fromdate_recu_view = $('#fromdate_recu_view').val(); //2025-01-01
var todate_recu_view = $('#todate_recu_view').val(); //2026-01-30
//hard-code data instead of AJAX, for this demo:
let new_data = {
"projectremindshow": [{
"project_ID": "8",
"project_title": "abc",
"period_type": "Yearly",
"recurrence_date": "2021-10-28",
"reminder_set_days": "12",
"recur_every": "2",
"start_date": "2021-09-28"
},
{
"project_ID": "10",
"project_title": "xyz",
"period_type": "Yearly",
"recurrence_date": "2021-10-05",
"reminder_set_days": "13",
"recur_every": "4",
"start_date": "2021-09-05"
},
{
"project_ID": "11",
"project_title": "mno",
"period_type": "Monthly",
"recurrence_date": "2021-10-01",
"reminder_set_days": "10",
"recur_every": "8",
"start_date": "2021-09-21"
}
]
};
let inputList = [];
for (var i = 0; i < new_data.projectremindshow.length; i++) {
var proj = new_data.projectremindshow[i];
//add a new entry to inputList for each entry returned from the AJAX call
inputList.push({
dateFrom: new Date(fromdate_recu_view),
dateTo: new Date(todate_recu_view),
daysBefore: proj.reminder_set_days,
recurrenceDate: new Date(proj.start_date),
period: proj.period_type,
skip: proj.recur_every,
title: proj.project_title
});
}
const frequencyList = inputList.map((el, index) => {
return getPaymentPlan(el)
});
console.log(frequencyList);
});
/* the getPaymentPlan function is standalone, it should not be within a loop or within any other callback functions! */
const getPaymentPlan = ({
dateFrom,
dateTo,
recurrenceDate,
daysBefore,
period,
skip,
title
}) => {
//start from either the recurrence start date, or the start date in the form - whichever is later
let startDate = (recurrenceDate.getTime() > dateFrom.getTime() ? recurrenceDate : dateFrom);
//reminders go out several days before the actual recurrence start date
startDate = startDate.subtractDays(daysBefore);
let recurObj = {
"project": title,
"recurrenceList": []
}
while (startDate.getTime() <= dateTo.getTime()) {
recurObj.recurrenceList.push(startDate.toISOString().split('T')[0]);
switch (period) {
case 'Monthly':
startDate = startDate.addMonths(parseInt(skip));
break;
case 'Yearly':
startDate.setFullYear(startDate.getFullYear() + parseInt(skip));
break;
default:
recurObj.recurrenceList.push("wrong period type is given")
break;
}
}
return recurObj;
}
/* below are some functions to correctly add / subtract days and months from a Date, accounting for leap years, differing month lengths, etc */
Date.prototype.addDays = function(days) {
var date = new Date(this.valueOf());
date.setDate(date.getDate() + days);
return date;
}
Date.prototype.subtractDays = function(days) {
var date = new Date(this.valueOf());
date.setDate(date.getDate() - days);
return date;
}
Date.prototype.addMonths = function(months) {
var date = new Date(this.valueOf());
var d = date.getDate();
date.setMonth(date.getMonth() + months);
if (date.getDate() != d) {
date.setDate(0);
}
return date;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
From date: <input type="date" id="fromdate_recu_view" /><br/> To date: <input type="date" id="todate_recu_view"><br/>
<button id="find_recurrence">Find Recurrence</button>
这是 getPaymentPlan 函数的替代版本,它将以更易于排序的格式输出数据,并且稍后根据您所需的 HTML 格式输出:
const getPaymentPlan = ({
dateFrom,
dateTo,
recurrenceDate,
daysBefore,
period,
skip,
title
}) => {
//start from either the recurrence start date, or the start date in the form - whichever is later
let startDate = (recurrenceDate.getTime() > dateFrom.getTime() ? recurrenceDate : dateFrom);
//reminders go out several days before the actual recurrence start date
startDate = startDate.subtractDays(daysBefore);
let recurrenceList = [];
while (startDate.getTime() <= dateTo.getTime()) {
recurrenceList.push({ "project": title, "reminderDate": startDate.toISOString().split('T')[0] });
switch (period) {
case 'Monthly':
startDate = startDate.addMonths(parseInt(skip));
break;
case 'Yearly':
startDate.setFullYear(startDate.getFullYear() + parseInt(skip));
break;
default:
recurrenceList.push({ "project": "wrong period type is given", "reminderDate": null })
break;
}
}
return recurrenceList;
}
推荐阅读
- c++ - 为什么使用 snprintf 将字符串复制到 char* 会导致某些字符串崩溃,而不是其他字符串?
- jdbc - Kafka 以递增模式连接
- swift - 是否可以在 Swift macOS 中使 NSBox 可点击(如 NSButton)?
- sql - 如何根据来自另一列 SQL 的值创建具有计数值的新列
- java - POSTGRESQL:此连接已在 prepareStatement 上关闭
- python - DBSCAN sklearn 很慢
- html - 如何使用这种结构使位置粘性起作用?
- android - 在 Cordova 8 中将资产文件放在哪里?
- python - 如何在循环中为每一行数据添加列标题?
- ubuntu - Crontab wget 不在数字海洋上运行