Как запустить beforeShowDay DatePicker из другой функции - PullRequest
Новая
       28

Как запустить beforeShowDay DatePicker из другой функции

16 голосов
/ 29 апреля 2011

У меня есть Datepicker со следующим кодом. У меня есть выпадающий список, и после изменения в окне dropDown я хочу запустить функцию datePicker beforeShowDay. Как я могу это сделать? 

var freeDate;

Часть моего кода выглядит следующим образом: 

$("#myDiv").datepicker({
    showOtherMonths: true,
    selectOtherMonths: true,
    dateFormat: "yy/mm/dd",
    onSelect: function(dateText, inst) {},
    onChangeMonthYear: function(year, month, inst) {
        $.ajax({
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            url: '@Url.Action("ListDates", "Party")',
            data: {
                date: new Date(year, month - 1, 1).toString("yyyy/MM/dd"),
                userID: userID
            },
            success: function(data) {
                freeDate = eval(data);
            },
            error: function(request, status, error) {}
        });
    },
    beforeShowDay: function(dateToShow) {
        var returnResult = new Array();
        returnResult.push(true);
        var itemMatched = false;
        $.each(freeDate, function(key, value) {
            if (new Date(parseInt(value.substr(6))).compareTo(dateToShow) == 0) {
                itemMatched = true;
                returnResult.push('timeNotFree');
                return;
            }
        });
        if (!itemMatched) returnResult.push('');
        returnResult.push('');
        return returnResult;
    }
});​

$('#myList').change(function() {
    userID = $("#userList > option:selected").attr("value");
    // myList is used to have freeDate and the DatePicker must be shown accordingly.
    $.ajax({
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        url: '@Url.Action("ListDates", "Party")',
        data: {
            date: new Date($("#myDiv").datepicker("getDate").toString("yyyy/MM/dd")),
            userID: userID
        },
        success: function(data) {
            freeDate = eval(data);
        },
        error: function(request, status, error) {}
    });
    $("#myDiv").datepicker("setDate", $("#myDiv").datepicker("getDate").toString("yyyy/MM/dd"));
});​

Ответы [ 2 ]

8 голосов
/ 05 мая 2011

beforeShowDay - это событие, которое вызывается средством выбора даты до отображения дня .Вы можете использовать его для настройки отображения ячейки, содержащей день, например, вы можете сделать ее красной, чтобы указать даты блокировки.

Из того, что я понимаю из вашего вопроса, вы можете вызвать метод datapicker.refresh(), чтобы указать, что переменная freeDate изменилась (например, ответом AJAX), и календарь нуждаетсячтобы быть отрендеренным снова: 

freeDate = eval(data);

Здесь меняется freeDate, и, вероятно, именно здесь вам следует вызвать метод .refresh().Обратите внимание, что AJAX является асинхронным по умолчанию, поэтому существует некоторая задержка между выбором значения и обратным вызовом события успеха.

А вот как вы вызываете метод для существующего средства выбора даты: 

.
.
.
freeDate = eval(data);
$("#myDiv").datepicker("refresh");
.
.
.
1 голос
/ 30 апреля 2011

Я бы сказал, что вы, вероятно, должны определить эту функцию вне вызова datepicker, а затем ваши изменения и datepicker могут вызвать эту функцию.

РЕДАКТИРОВАТЬ: Добавлено уточнение.

Попытка выяснить, как работает плагин для вызова функции, вероятно, требует больше работы, чем она того стоит. Вы можете определить функцию отдельно, а затем просто передать ее плагину. Тогда ваше событие изменения выпадающего списка может вызвать этот независимый метод.

Примерно так: 

function doMyThing(dateToShow){
   // do stuff
}

$("#myDiv").datepicker({
    ...
    beforeShowDay: function(dateToShow){
        doMyThing(dateToShow);
    }
});  

$('#myList').change(function () {
    doMyThing(dateToShow);
});

Единственное, в чем я не уверен, это то, что вы захотите передать в качестве параметра в onchange. Поскольку нажатие на дату не является действием, я не знаю, каким должно быть «dateToShow».

...