jquery newbie: combine validate with hidding submit button.

Posted by Jeffb on Stack Overflow See other posts from Stack Overflow or by Jeffb
Published on 2010-04-05T22:23:39Z Indexed on 2010/04/05 22:33 UTC
Read the original article Hit count: 436

I'm new a jQuery. I have gotten validate to work with my form (MVC 1.0 / C#) with this:

      <script type="text/javascript">
      if (document.forms.length > 0) { document.forms[0].id = "PageForm"; document.forms[0].name = "PageForm"; }
      $(document).ready(function() {
          $("#PageForm").validate({
              rules: {
                  SigP: { required: true }
              },
              messages: {
                  SigP: "<font color='red'><b>A Sig Value is required. </b></font>"
              }
          });

      });
  </script>

I also want to hide the Submit button to prevent twitchy mouse syndrome from causing duplicate entry before the controller completes and redirects (I'm using an GPR pattern). The following works for this purpose:

  <script type="text/javascript">  
  //
  // prevent double-click on submit
  //
      jQuery('input[type=submit]').click(function() {
          if (jQuery.data(this, 'clicked')) {
              return false;
          }
          else {
              jQuery.data(this, 'clicked', true);
              return true;
          }
      });
  </script>

However, I can't get the two to work together. Specifically, if validate fails after the Submit button is clicked (which happens given how the form works), then I can't get the form submitted again unless I do a browser refresh that resets the 'clicked' property.

How can I rewrite the second method above to not set the clicked property unless the form validates?

Thx.

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about validate