title: jQuery UI dialog content is showing up in page itself
body: <p>I have jQuery UI dialog in my application and button click will open this jQuery UI dialog content define in Diag div. I have also other control on the same page like asp.net dropdown list. Problem I am having is jQuery UI dialog div content is showing up in page itself instead of on dialog pop up. Is there anything I need to do to make dialog div invisible on page.</p>
  
  <pre><code>    &lt;asp:DropDownList ID="dd" runat="server" AutoPostBack="true"&gt;
          &lt;asp:ListItem&gt;asfasf&lt;/asp:ListItem&gt;
          &lt;asp:ListItem&gt;asfasf&lt;/asp:ListItem&gt;
      &lt;/asp:DropDownList&gt;
      &lt;input type="button" id="btnSaveAs" value="Submit" /&gt;
      &lt;div id="Diag"&gt;
          Test text
      &lt;/div&gt;
  </code></pre>
  
  <p>jQuery code </p>
  
  <pre><code>  $(function () {
          $('#btnSaveAs').on('click', function () {
              $("#Diag").dialog({
                  resizable: false,
                  width: 400,
                  height: "auto",
                  modal: true,
                  title: 'new window',
                  buttons: {
                      "Save Record": addUser,
                      Cancel: function () {
                          $(this).dialog("close");
                      }
                  }
              });
          });
     });
  </code></pre>