将 JSON 数据绑定到日期范围选取器日历

Bind JSON data to date range picker calendar

本文关键字:选取 日历 范围 日期 JSON 数据绑定      更新时间:2023-09-26

我正在使用 JSON 来存储数据并使用日期范围选择器作为以下代码。

$(function() {
        $("#datepicker").datepicker({
            beforeShowDay: function(date) {
                var date1 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input1").val());
                var date2 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input2").val());
                return [true, date1 && ((date.getTime() == date1.getTime()) || (date2 && date >= date1 && date <= date2)) ? "dp-highlight" : ""];
            },
            onSelect: function(dateText, inst) {
                var date1 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input1").val());
                var date2 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input2").val());
                if (!date1 || date2) {
                    $("#input1").val(dateText);
                    $("#input2").val("");
                    $(this).datepicker("option", "minDate", dateText);
                } else {
                    $("#input2").val(dateText);
                    $(this).datepicker("option", "minDate", null);
                }
                //$("#dateoutput").html("Chosen date is <b>" + date1 + "</b> - <b>" + dateText + "</b>");
            }
        });
    });

如何根据所选日期范围绑定数据。

enter code here

我不完全确定你想做什么,但我根据我的理解制作了一个 JSFiddle。

要进行测试,请执行以下操作:

1)我已将初始日期保存为JSON字符串,因此您可以单击"加载JSON日期",它将解析JSON字符串并将值存储在2个输入字段中。

2)然后,您可以选择另一个日期范围,然后单击"存储JSON数据",它将字符串化数据。

3) 更改日期

4) 单击"加载 JSON 数据",它会将字段重置回您存储的数据。

http://jsfiddle.net/1xqbgshm/4/

该代码执行以下操作:

$("#store").click(function () {
    var date1 = $("#input1").val();
    var date2 = $("#input2").val();
    var dateObject = {
        "fromDate": date1,
        "toDate": date2
    };
    jsonString = JSON.stringify(dateObject);
    alert(jsonString);
});
$("#load").click(function () {
    var javascriptObject = $.parseJSON(jsonString);
    $("#input1").val(javascriptObject.fromDate);
    $("#input2").val(javascriptObject.toDate);
});

这有帮助吗?