Ich musste mehr als einmal auf Senden Schaltfläche drücken, um das Formular zu arbeiten, (Ergebnis laden in colorbox Popup)

Question

Die Formularvalidierung funktioniert gut, wenn Sie also die E-Mail-Eingabe leer und HIT senden ONCE, wird es den Fehler msg werfen . Aber wenn Sie das E-Mail-Feld [input] ausfüllen, musste ich zweimal auf "submitBtn" tippen, manchmal sogar noch mehr, um das Ergebnis tatsächlich anzuzeigen.

so ist dies das Skript:

$('#RetrieveQuote2').validate({ 
    rules: { 
     email: { 
      required: true, 
      email: true 
     } 
    }, 
    errorPlacement: function(error, element) { 
     error.insertBefore(element); 
    }, 

    submitHandler: function() { 
     $('input#submitBtn').bind('click', function() { 
      var content = $("input#email").val(); 
      if (content == "abc@abc.com") { 
       $('.quotenotfound').show(); 
       return false; 
      } else { 
       $('form#RetrieveQuote2').submit(); 

       formValidationSubmitted = true; 

       if (!$('#RetrieveQuote2').valid()) { 
        $('.errorMessage').show(); 
       } 

       $("input#submitBtn").colorbox({ 
        href: function() { 
         var url = $(this).parents('form').attr('action'); 
         var ser = $(this).parents('form').serialize(); //alert(url+'?'+ser); 
         return url + '?' + ser; 
        }, 
        innerWidth: "780", 
        innerHeight: "450", 
        iframe: true 
       }); 
      } // end of else 
     }); 
    } // end of submitHandler 
}); 

und unten ist das HTML-Formular:

<form name="RetrieveQuote2" id="RetrieveQuote2" action="overlays/quotelist.php" method="get"> 
    <fieldset class="cf"> 
    <legend>email</legend> 
    <label>Your Email</label> 
    <input type="text" name="email" id="email" value="" maxlength="25"/> 
    <div class="submit"> 
     <input type="submit" name="RetrieveQuote" class="rqSubmitBtn" id="submitBtn" value="SUBMIT" /> 
    </div> 
    </fieldset> 
</form> 

Answer 1

Das Problem ist, dass Sie von den Handler der Submit-Button innerhalb hinzuzufügen versuchen, Ihr Submit-Handler.

Also wird der Validierungshandler beim ersten Klick aufgerufen (aus dem Click-Handler, den er automatisch hinzufügt), und dann wird der Click-Handler hinzugefügt, aber nicht ausgeführt. Der zweite Klick, fügen Sie ein weiteres Click-Handler hinzu, und dann wird derjenige aufgerufen, den Sie beim ersten Mal hinzugefügt haben.

Das Validierungs-Plugin sollte den Handler automatisch für Sie hinzufügen.

Entfernen Sie $('input#submitBtn').bind('click', function() { um den Inhalt Ihres Submit-Handlers.

Sie brauchen auch nicht $('form#RetrieveQuote2').submit(); Dies geschieht auch automatisch nach dem Übermittlungs-Handler.

Demo: http://jsfiddle.net/asrfV/