I have a pageLoad function that sets some CSS on a .ascx control that I cannot change. On page load everything is fine, but when an update panel updates the control, my CSS is no longer applied. How can I rerun my function after the page updates?
$(function() {
$("textarea").attr("cols", "30");
$("input.tbMarker").css({ "width": "100px" }).attr("cols","25");
});
This obviously only runs on the initial page load. How can I run it after an update?
Adding an add_pageLoaded handler can also work.
Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(PageLoadedHandler);
Note: the handler will fire for any callback, but you can use sender._postBackSettings.panelID to filter when you want your function called.
More samples:
During your postback for the update panel, in the server code, use ClientScriptManager to add some new script to the page, something like this:
ClientScriptManager.RegisterStartupScript(
typeof(page1),
"CssFix",
"javascriptFunctionName()",
true);
Encapsulate your javascript in a named function that matches the third argument there, and it should execute when the postback returns.
You can also bind to an event in client side code (JavaScript) every time an UpdatePanel has finished like this:
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function(){myFunction();});
So in this case myFunction(); will be called every time an UpdatePanel postback has occurred. If you execute this code when the page is loaded the function will be called on the correct time.