jQuery в UpdatePanel Wrapper для PageRequestManager.getInstance (). add_endRequest - PullRequest
Новая
       8

jQuery в UpdatePanel Wrapper для PageRequestManager.getInstance (). add_endRequest

2 голосов
/ 18 марта 2011

Когда jQuery применяется к элементам в UpdatePanel, когда UpdatePanel обновляется, jQuery не применяется к вновь внедренному HTML.

Эта проблема решена с помощью 

Sys.WebForms.PageRequestManager.getInstance().add_endRequest()

, чтобы зарегистрировать функцию, которая будет вызываться при завершении запроса AJAX:

Я написал функцию, которая регистрирует функцию с помощью add_endRequest, а также вызывает ее одновременно: 

Async.RegisterAndRun = function(callback) {
    //register function to be run when an update panel request is complete
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(callback);
    //also run the function right now.
    callback();
};

Теперь все, что нам нужно для вызова, это 

Async.RegisterAndRun(AddFancyjQueryToMyHTML);

или 

Async.RegisterAndRun(function(){
    AddFancyjQueryToMyHTML();
    AddMoreFancyjQueryToMyHTML('with', 'args');
});

Мой вопрос: вы можете придумать, как это улучшить? В настоящее время он делает то, что мне нужно, и мне никогда не нужно явно вызывать add_endRequest, что приятно.

Ответы [ 2 ]

0 голосов
/ 18 марта 2011

Первое улучшение, которое я бы предложил, это не использовать add_endRequest, а add_pageLoaded (). Обратный вызов add_pageLoaded фактически вызывается, когда DOM страницы загружен и готов к использованию другими библиотеками.

Я много раз сталкивался с этой проблемой, связанной с тем, что элемент DOM панели «Обновление» превращался в призрачные элементы в селекторах jQuery. Однако, если вы не кэшируете элемент DOM в селекторах jQuery, то есть вы не делаете 

var myGrid = $(".Grid")

тогда все будет в порядке, так как выполнение $ (". Grid") всегда даст вам правильный элемент DOM после окончания обновления панели обновления.

Если, однако, ваша проблема связана с обработчиками событий, связанными с элементами DOM, то одним из кратких способов достижения этого будет иметь обработчик событий, определенный как 

$("#myVanishingElement").unbind().die().live("event","handler");

это гарантирует, что вам нужно вызывать этот код только один раз (а не в каждом add_endRequest). Живой механизм jQuery может автоматически позаботиться об элементах, появляющихся и исчезающих со страницы.

Основная проблема с этим подходом будет в том, что ваши элементы не готовы до первого постбэка от Updatepanel. Чтобы обойти это, определите функцию под названием (в точности как) pageLoad в ваших JS-скриптах 

function pageLoad(sender, e) {
//jQuery event binding goes here.
}

Эта функция будет автоматически вызываться библиотекой MS Ajax при каждом обратном вызове Asynch. Это встроенная функция в библиотеках MS AJAX. Конечно, это также означает, что вы можете определить только один обработчик события pageLoad в вашем коде глобально.

Недавно я написал клиентскую платформу, которая делает много умных вещей с DOM, который меняется параллельно MS Ajax и jQuery. Он учитывает состояние гонки, доступность элементов DOM, инициализацию и удаление различных обработчиков событий и т. Д. Я буду рад поделиться им, если хотите.

0 голосов
/ 18 марта 2011 
            with(Sys.WebForms.PageRequestManager.getInstance()  ) {
                add_beginRequest(onBeginRequest);
                add_endRequest(onEndRequest);
            }

            function onBeginRequest(sender, args) {
         //       $.blockUI({ message: "<h3>.منتظر باشید</h3>  IranFairCo.com",overlayCSS:     { backgroundColor: '#00f' }});
            }

            function onEndRequest(sender, args) {
           //     $.unblockUI();
            }
...