1

我在 twitter bootstrap 模式上有 datepicker。为了突出显示某些日期，日期选择器在“成功”部分中作为 ajax 调用生成。

我设法突出显示我想在本月突出显示的日期，这很好。

但是当我切换到上个月或下个月时，我想再次进行 ajax 调用并渲染日期以突出显示。下面你可以看到我的代码：

function nonValidated() {           

        var date = new Date();
        date.addDays(-date.getDate() + 1);
        var startDate = [date.getDate().lpad(2), (date.getMonth() + 1).lpad(2), date.getFullYear()].join('/');
        var enddate = new Date();
        enddate.setDate(date.getDaysInMonth());
        var endDate = [enddate.getDate().lpad(2), (enddate.getMonth() + 1).lpad(2), enddate.getFullYear()].join('/');
        var depId = $('#serviceSelector').val();


        $.ajax({
            type: "POST",
            url: "/ServiceManagement/GetUnassignedSlots",
            data: { "from": startDate, "to": endDate, "depId": depId },
            success: function (data) {
                $.datepicker.setDefaults(
                  $.extend(
                    { 'dateFormat': 'dd/mm/yy' },
                    $.datepicker.regional['nl-BE']
                  )
                );
                $("#nonValidatedDatepicker").datepicker(
                    {
                        inline: true,
                        beforeShowDay: function (date) {

                            var theday = date.getDate() + '/' +
                            (date.getMonth() + 1).lpad(2) + '/' +
                            date.getFullYear();
                            return [true, $.inArray(theday, data.result) >= 0 ? "warningDate" : ''];
                        },
                        onSelect: function (dateText, inst) {
                            var dateParts = dateText.split('/');
                            if (dateParts[0][0] == '0') dateParts[0] = dateParts[0][1];
                            if (dateParts[1][0] == '0') dateParts[1] = dateParts[1][1];
                            var newdate = new Date(dateParts[2], dateParts[0]-1, dateParts[1]);

                            var dayOfWeek = newdate.getDay();
                            if (dayOfWeek == 0) dayOfWeek = 7;
                            var weekstart = new Date(newdate.getFullYear(), newdate.getMonth(), newdate.getDate());
                            weekstart.addDays(-dayOfWeek + 1);
                            var weekend = new Date(newdate.getFullYear(), newdate.getMonth(), newdate.getDate());
                            weekend.addDays(7 - dayOfWeek);

                            $('#SelectWeekDate').val([weekstart.getDate().lpad(2), (weekstart.getMonth() + 1).lpad(2), weekstart.getFullYear()].join('/') + ' - ' + [weekend.getDate().lpad(2), (weekend.getMonth() + 1).lpad(2), weekend.getFullYear()].join('/'));
                            $('#modalNonValidated').modal('hide');
                            InitFillPage();
                        },
                        onChangeMonthYear: function (year, month, widget) {


                        }
                    }
                    );

            },
            error: function (data) {
            },
            statusCode: {
                401: function (data) {
                    //ERROR 401: Unauthenticated
                    window.location.href = '/Account/Login?ReturnUrl=' + encodeURIComponent(window.location.pathname);
                }
            }
        });
    }

有人知道我如何结合 onchangemonthyear 和 beforeshowday 吗？

4

1 回答 1

2

I would split the code that shows the datepicker and the code that makes the ajax call to get the data for the datepicker (the data that determines which days to highlight) into 2 separate functions. You can call the function that makes the ajax call from the function that first shows the datepicker, and again from your onChangeMonthYear function. Also, make sure that the ajax call to get the data is made synchronously (set async: false option) so that the data comes back before your beforeShowDay function runs.

Hope that helps!

于 2013-08-14T16:41:59.373 回答