title: jQuery dialog stops showing after ajax postback with asp:updatepanel
body: <p>I have <code>asp validator</code> controls and <code>jquery dialog</code>.
  I'm using <code>asp:UpdatePanel</code> for <code>ajax</code>.</p>
  
  <p>After page is refreshed, <code>validators</code> still are validating fields by showing <code>*</code> symbol if something is wrong, however, my <code>jQuery</code> pop up does not pop up anymore.</p>
  
  <p>It stopped working after I fixed the problem when <code>datepicker</code> stopped showing after <code>postback</code>. To fix that I added the following code:</p>
  
  <pre><code> $(document).ready(function () {
      Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
      Sys.WebForms.PageRequestManager.getInstance().beginAsyncPostBack();
      function EndRequestHandler(sender, args) {
          $('.datepicker1, .datepicker2').datepicker({
              dateFormat: "mm/dd/yy",
              defaultDate: "1w",
              changeMonth: true,
              numberOfMonth: 1
          });
      }
  });
  </code></pre>
  
  <p>That fixed <code>datepicker</code> problem. However, it broke, validators logic that displayed validation pop up. Here is the code for validation:</p>
  
  <pre><code>function ValidateFields() {
      var isValid = false;
  
      isValid = Page_ClientValidate('vgForm');
  
      if(!isValid){
          $('#errorDisplay').dialog({
             title: "Validation Error",
             modal: true,
             resizable: false,
             width: 250,
             buttons:{
             Close: function(){
                  $(this).dialog('close');
                  }
             }
         });
      return false;
  }
  return true;
  }
  </code></pre>
  
  <p>What is the right way to fix that?</p>
  
  <hr>
  
  <p>I found some fix to the problem, but now, as soon as page loads, Validators show <code>*</code> and jQuery pop up is displayed, if required fields fail validation.</p>
  
  <p>Here is an update:</p>
  
  <pre><code>&lt;script language="javascript"&gt;
  
      function ValidateFields() {
          var isValid = false;
  
          isValid = Page_ClientValidate('vgForm');
  
              if (!isValid) {
                  $('#errorDisplay').dialog({
                      title: "Validation Error",
                      modal: true,
                      resizable: false,
                      width: 250,
                      buttons: {
                          Close: function () {
                              $(this).dialog('close');
                          }
                      }
                  });
                  return false;
              }
              return true;
          }
  
          function DatePickerInit() {
              $(".datepicker1, .datepicker2").datepicker({
                  dateFormat: "mm/dd/yy",
                  defaultDate: "1w",
                  changeMonth: true,
                  numberOfMonth: 1
              });
  
          }
  
  &lt;/script&gt;
  
  &lt;script language="javascript"&gt;
  
      $(function () {
  
          ValidateFields();
          DatePickerInit();
      });
  &lt;/script&gt;
  
  &lt;asp:ScriptManager ID="SM" runat="server"&gt;
  &lt;/asp:ScriptManager&gt;
  
  &lt;script type="text/javascript"&gt;
      Sys.WebForms.PageRequestManager.getInstance().add_endRequest(ValidateFields);
      Sys.WebForms.PageRequestManager.getInstance().add_endRequest(DatePickerInit);
  &lt;/script&gt;
  
  
  &lt;asp:UpdatePanel ID="updatepanel1" runat="server"&gt;
  &lt;ContentTemplate&gt;
  
  //Form and GridView goes here
  
  &lt;/ContentTemplate&gt;
  &lt;/asp:UpdatePanel&gt;
  
  &lt;div id="errorDisplay"&gt;
       &lt;asp:ValidationSummary ID="vSum" runat="server" ShowSummary="true" ValidationGroup="vgForm"&gt;&lt;/asp:ValidationSummary&gt;   
  &lt;/div&gt;
  </code></pre>