1

我正在使用 gldatepicker。我想通过 ajax 从数据库中为 gldatepicker 加载一些设置，例如星期几、特殊日期等。现在我有以下 js 代码：

$(document).ready(function () {
    loadAllSettings();
});
var loadAllSettings = function () {
    startDate = '';
    endDate = '';
    selectDay = '';
    offdays = '';

    $.ajax({
        url: "bs_client_function.php",
        type: "post",
        dataType: "json",
        data: {
            action: 'getDateRange'
        },
        success: function (html) {
            // alert(html.start);
            startDate = Date.parse(html.start);
            endDate = Date.parse(html.end);
        }

    });
    $.ajax({
        url: "bs_client_function.php",
        type: "post",
        dataType: "json",
        data: {
            action: 'getOffdays'
        },
        success: function (html) {
            i = 0;
            offdays = '[';
            while (i < html.length) {
                offdays = offdays + {
                    date: new Date(html[i]),
                    repeatYear: false,
                    cssClass: 'noday'
                };
                i = i + 1;
            }
            offdays = offdays + ']';
        }

    });
    $.ajax({
        url: "bs_client_function.php",
        type: "post",
        data: {
            action: 'getDays'
        },
        success: function (html) {
            var data = $.parseJSON(html);
            // alert("[" + data + "]");
            selectDay = '[' + data + ']';
            // alert(selectDay);
           showCalender(startDate, endDate, selectDay, offdays);
        }

    });
    alert(selectDay);
    console.log('selectDay' + selectDay);

};

我检查了所有数据的格式是否正确，如 gldatepicker recommanded。在我的显示日历功能中：

var showCalender = function (startDate, endDate, selectDay, offdays) {
    var dd = $('#mydate').glDatePicker({
        showAlways: true,
        allowMonthSelect: true,
        allowYearSelect: false,
        prevArrow: '\u25c4',
        nextArrow: '\u25ba',
        cssName: 'darkneon',
        selectableDOW: selectDay,
        dowOffset: 0,
        selectedDate: new Date(),
        selectableDateRange: [{
            from: new Date(startDate),
            to: new Date(endDate)
        }, ],
        specialDates: offdays
    });
};

现在只有 stardate 和 enddate 正常工作。selectDay,offdays 不工作。我在控制台中打印 selectDay 我得到了这个：[1,2,3] 但它没有工作。我错过了什么或者应该是正确的方法。 提前致谢...

4

1 回答 1

0

问题是您如何获取填充 glDatePicker 的数据。您有 3 个 ajax 调用，这些调用默认是异步的，您在最后一个成功函数中执行 showCalender 函数，但您不确定前面的调用是否已完成。

async您可以通过设置参数以false查看 jQuery文档来使您的 ajax 调用同步：

async (默认：true) 类型：Boolean 默认情况下，所有请求都是异步发送的（即默认设置为true）。如果您需要同步请求，请将此选项设置为 false。跨域请求和 dataType: "jsonp" 请求不支持同步操作。请注意，同步请求可能会暂时锁定浏览器，从而在请求处于活动状态时禁用任何操作。从 jQuery 1.8 开始，不推荐在 jqXHR ($.Deferred) 中使用 async: false ；您必须使用成功/错误/完成回调选项而不是 jqXHR 对象的相应方法，例如 jqXHR.done() 或已弃用的 jqXHR.success()。

或者您可以在每个成功回调中链接它们，但是您的代码将难以维护，或者您可以使用此插件来管理多个 ajax 调用http://docs.jquery.com/AjaxQueue

它适用于本地数据，请参阅：http: //jsfiddle.net/IrvinDominin/V59E7/

只关注specialDates选项需要的对象：

   specialDates: [{
       date: new Date(0, 8, 5),
       data: {
           message: 'Happy Birthday!'
       },
       repeatYear: true,
       cssClass: 'special-bday'
   }, {
       date: new Date(2013, 0, 8),
       data: {
           message: 'Meeting every day 8 of the month'
       },
       repeatMonth: true
   }]
于 2013-05-05T09:19:22.607 回答