What exactly happens when an UpdatePanel
's response is received by the client and it renders on the page?
The motivation for this question is finding a proper solution for the problem brought up in this question and this jQueryUI ticket. Essentially, weird things happen when a jQueryUI datepicker is attached to a TextBox
in an UpdatePanel
and is open when that UpdatePanel
updates.
This question and its linked article suggest that it's nothing more than this:
document.getElementById('updatePanelContainer').innerHTML = responseHtml;
But I've tried that in this jsfiddle and the datepicker just completely stops working except for the Done button; the behavior I'm seeing with the partial postback is that the datepicker still works, but its state is taken out from under it. When I debug it with the jQueryUI non-minified code, I see that the drawYear
and drawMonth
properties lose their values (become 0).
In playing around with Firebug and watching as a partial postback occurs, I've noticed the following changes in the page:
span
elements get added to the bottom of the page that contain hidden fields with ASP.NET info in them (seems similar to __VIEWSTATE)update
element changes in small ways (spaces vs tabs, maybe)UPDATE: I managed to get the repro working; they key is to reinitialize the datepicker after recreating the input it's bound to. See the latest revision of the jsfiddle mentioned above. I'd still like to know, though, if there's anything special that the partial postback does.
A partial postback simply sends back the appropriate HTML for the div within the UpdatePanel, and that html is replaced with the response. The full postback lifecycle still occurs on the server, so you must be careful when updating controls outside of your UpdatePanel as those changes will not reflect on the client but can have unintended side effects.