Обратный вызов DWR, обновляющий dom-элементы, jquery ui datepicker, прикрепленный к обновленному элементу, не отображается - PullRequest
Новая
       16

Обратный вызов DWR, обновляющий dom-элементы, jquery ui datepicker, прикрепленный к обновленному элементу, не отображается

0 голосов
/ 25 ноября 2011

У меня есть поисковая форма, в которой у меня есть следующее поле INPUT 

  <input id="pickUpDate" name="pickUpDate" readonly="true" />

Когда эта форма поиска доступна, я вижу, когда при нажатии на нее появляется элемент выбора даты, присоединенный к элементу input # pickUpDate.

Я отправляю эту форму поиска, используя DWR, вызывая функцию поиска (...) (показана ниже).

Я сбрасываю данные элемента тела HTML с ответомЯ получил.В полученном ответе у меня есть похожая форма поиска, которая содержит тот же элемент ввода (input # pickUpDate). Однако после Я сбрасываю данные элемента body, используя 

    $("body").html(data);

в DWRФункция обратного вызова и попытка присоединить DatePicker не работает. Я проверил, что к элементу добавлено имя класса маркера hasDatepicker DatePicker, но при фокусировке / щелчке по полю ввода я не вижу DatePicker.

Следующиймой код jQuery: 

 (function($){

    enableDatePicker = function(elementSelector) {

        var datePickerInitialisationOptions = {
                numberOfMonths : 3,
                buttonImage : "resources/images/calendar.gif",
                buttonImageOnly : true,
                showOn : 'both',
                closeText : 'Close',
                showButtonPanel : true
            };

        $(elementSelector).datepicker(datePickerInitialisationOptions); 

    };

    // Makes a DWR call
    search = function(..function_params...) {

        AsyncService.getSearchResults(
                ...function_params..., {

            callback: function(data) {

                $("body").html(data);

                $('#pickUpDate').datepicker();

            },

            errorHandler: function(message) {
                alert("Oops: " + message);
            }
        });
    };

}) (jQuery);

$(document).ready(function() {

    $("#id_search-submit").click(function(){        

            ....params...

            search(params);

    });

    enableDatePicker("#pickUpDate"); // This works fine.That is the date picker is shown on initial access of search form when clicking on the INPUT element having id 'pickUpDate';
});

Я просмотрел все соответствующие посты, которые мог найти по этому поводу, но упомянутые в них решения не помогли мне.

Я нуждаюсьчтобы узнать, что является причиной упомянутой проблемы и как ее решить?

Спасибо,
Jignesh

1 Ответ

0 голосов
/ 28 ноября 2011

Я получил это решение. И разместил здесь свое решение для справки: 

// Makes a DWR call
search = function(..function_params...) {

    AsyncService.getSearchResults(
            ...function_params..., {

        callback: function(data) {

            $("body").html(data);


    $.datepicker.initialized = false; // This resolved the problem
            $('#pickUpDate').datepicker();

        },

        errorHandler: function(message) {
            alert("Oops: " + message);
        }
    });
};

Согласно тому, что я понял, это объяснение причины проблемы

До AJAXвызвать его значение было установлено в true следующим блоком в исходном коде jquery.ui.datepicker.js (этот блок можно найти в конце файла)

Код: 

/* Initialise the date picker. */
if (!$.datepicker.initialized) {
    $(document).mousedown($.datepicker._checkExternalClick).
    find('body').append($.datepicker.dpDiv);
    $.datepicker.initialized = true;
}

Так как значение $. Datepicker.initialized всегда находилось "true" после того, как HTML обновлялся на странице с помощью DWR, div презентации ссылается на $. Datepicker.dpDiv в jquery.ui.datepicker.js исходный код не добавлялся к тегу , когда datepicker () вызывался для элемента, который вызывал указатель датыза то, что он не отображался, хотя класс маркера 'hasDatepicker ' был применен.

Спасибо, Jignesh

...