Shulou(Shulou.com)06/03 Report--

This article mainly introduces "how to solve the incompatibility between UpdatePanel and jQuery". In daily operation, I believe many people have doubts about how to solve the incompatibility between UpdatePanel and jQuery. The editor consulted all kinds of materials and sorted out simple and easy-to-use operation methods. I hope it will be helpful to answer the doubts of "how to solve the incompatibility between UpdatePanel and jQuery". Next, please follow the editor to study!

In doing the project, it was found that where UpdatePanel was used, jquery was invalid after a partial refresh.

It was later discovered that the ready event in jquery runs once after the DOM is fully loaded, but when we use UpdatePanel, it only updates locally and does not reload all the Dom on the page, so the ready event in jquery will not be executed again. So, we can extract the code executed in the ready event, and then execute the jQuery initialization code once after each UpdatePanel local refresh by capturing the EndRequest event of ScriptManager:

The copy code is as follows:

/ / handle the conflict between ajax and ScriptManager

Function load () {

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

}

Function EndRequestHandler () {

$(function () {)

("tbody") .find ("input:checkbox") .each (function (key, val) {

$(val) .click (function () {

Var cbxId = $(this) .attr ("id")

Var state = $(this) .attr ("checked")

$.post ("Ajax/UpdateStatus.ashx", {"id": cbxId, "isChecked": state, "fid": "SamID"}, isReturnStatus)

});

});

$("thead"). Find ("input:checkbox"). Click (

Function () {

If (confirm ("are you sure you want to update this column of data?") = = true) {

Var cbxId = $(this) .attr ("id")

Var name = cbxId.substr (16)

Var v = "tbody." + name + "input [type = 'checkbox']"

If ($(this) .attr ("checked") = = "checked") {

$(v) .attr ("checked", true)

}

Else {

$(v) .attr ("checked", false)

}

Var state = $(this) .attr ("checked")

$.post ("Ajax/UpdateStatus.ashx", {"id": cbxId, "isChecked": state}, isReturnStatus)

}

Else {

If ($(this) .attr ("checked") = = "checked") {

$(this) .attr ("checked", false)

}

Else {

$(this) .attr ("checked", true)

}

}

});

});

InitCheckedStaus ()

}

At this point, the study on "how to solve the incompatibility between UpdatePanel and jQuery" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.