title: jQuery modal and asp.net button click
body: <p>I have read some solutions to this issue but all of them are using a dialog and not a modal, plus none of the solutions I have tried work yet. The issue is I can't get my asp button click to fire inside of a jquery modal. here is the code:</p>
  
  <pre class="lang-js prettyprint-override"><code>$(function () {
  
      $('.showmodal-login').click(function (e) {
         // e.preventDefault();
          ShowLoginForm($(this).attr('href'));
  
          return false;
      });
  
      $('#&lt;%= btnClose.ClientID %&gt;').click(function (e) {
          e.preventDefault();
          if (isMobile) {
              $('.modal-content').each(function () {
                  if ($(this).is(':visible')) {
                      $(this).toggle();
                  }
              });
              $("#main").toggle();
          }
          else {
              $.modal.close();
          }
          return false;
      });
  
  });
  </code></pre>
  
  <pre class="lang-js prettyprint-override"><code>function ShowLoginForm(redirectUrl) {
      if (isMobile) {
          $("#modal-login").toggle();
          $("#main").toggle();
          $('#login-form').show();
          $('#login-message').hide();
         // $('#&lt;%= btnSubmit.ClientID %&gt;').attr('data-redirecturl', redirectUrl);
      }
      else {
          $("#modal-login").modal({
              maxWidth: 338,
              autoResize: false,
              close: false,
              onShow: function (dlg) {
                  $('#login-form').show();
                  $('#login-message').hide();
                  //$('#&lt;%= btnSubmit.ClientID %&gt;').attr('data-redirecturl', redirectUrl);
                  ResizeModal();
              }
          });
      }
  }
  </code></pre>
  
  <p></p>
  
  <h2>html</h2>
  
  <pre><code> &lt;div id="modal-login" class="modal-content"&gt;
  
  &lt;div id="login-form"&gt;
      &lt;div class="content-wrap"&gt;
  
          &lt;p&gt;Login with your username and password to access the selected link.&lt;/p&gt;
          &lt;asp:Label ID="lblUsername" runat="server" AssociatedControlID="txtUsername"&gt;Username:&lt;/asp:Label&gt;
          &lt;asp:TextBox ID="txtUsername" runat="server" Width="268px" ClientIDMode="Static" /&gt;
          &lt;asp:Label ID="lblPassword" runat="server" AssociatedControlID="txtPassword"&gt;Password:&lt;/asp:Label&gt;
          &lt;asp:TextBox ID="txtPassword" runat="server" Width="268px" ClientIDMode="Static" TextMode="Password" /&gt;
      &lt;/div&gt;
      &lt;div id="btnSub" class="buttons"&gt;
          &lt;asp:HyperLink ID="hlnkCancel" runat="server" NavigateUrl="#" CssClass="close-modal"&gt;Cancel&lt;/asp:HyperLink&gt;
          &lt;asp:Button ID="btnSubmit" runat="server" Text="Login" OnClick="btnSubmit_Click" /&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div id="login-message"&gt;
      &lt;div class="content-wrap"&gt;
      &lt;/div&gt;
      &lt;div class="buttons"&gt;
          &lt;asp:Button ID="btnClose" runat="server" Text="Close" /&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>I have solved this in the past with the jquery dialog by adding </p>
  
  <pre><code> function reLoad() {
      // jQuery.post();
      document.forms["frmMain"].submit();
  }
  </code></pre>
  
  <p>but that didn't work in this case.</p>