Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>UpdatePanels cause new elements to be placed in the page when they post back. It is no longer the same element so your bindings are not in place any longer. If you are using jQuery and are tying events together you can use their <code>live</code> API found <a href="http://api.jquery.com/live/" rel="nofollow">here</a>. Otherwise for things, such as datepickers, that fire once and fundamentally change the functionality of an item you need to fire some javascript once the new elements are loaded; all this requires is tying some javascript calls to a Microsoft provided call back function:</p> <pre><code>function BindEvents() { //Here your jQuery function calls go } var prm = Sys.WebForms.PageRequestManager.getInstance(); prm.add_endRequest(BindEvents); </code></pre> <p>Edit: Based on your comment I would make the DatePicker.js file like this:</p> <pre><code>$(document).ready(function () { // Call BindDatePicker so that the DatePicker is bound on initial page request BindDatePicker(); // Add BindDatePicker to the PageRequestManager so that it // is called after each UpdatePanel load var prm = Sys.WebForms.PageRequestManager.getInstance(); prm.add_endRequest(BindDatePicker); }); // We put the actual binding of the DatePicker to the input here // so that we can call it multiple times. Other binds that need to happen to the // elements inside the UpdatePanel can be put here as well. var BindDatePicker = function() { $('.DatepickerInput').datepicker({ showAnim: 'blind', autoSize: true, dateFormat: 'dd-mm-yy' }); }; </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload