Formularz sprawdzania poprawności wtyczki jQuery Validation po kliknięciu przycisku - jquery, formularze, sprawdzanie poprawności jquery

Mam więc siedmioczęściową formę, w której sześć kart jest ukrytych za pomocą CSS, a gdy użytkownik kliknie następną, kolejna część przechodzi.

Przesłałem stronę, aby upewnić się, że wtyczka działa; tak jest. Zasadniczo chodzi tylko o przejście do następnej części formularza bez sprawdzania aktualnej części

Jako przykład

HTML

<form id = "form1" action = "backend.php" method = "post">
<label for "phone">First Name </label>
<input type = "text" name = "fName" placeholder = "First Name..." class = "required" id = "fName" />
<button id = "btn" type = "button" class = "buttonnav next">next</button>
</form>

JavaScript

$("#btn").click( function() { $("#form1").validate();});

Odpowiedzi:

Jeśli używasz jQuery Validate wtyczka, z twoim kodem wtyczka nie jest inicjowana, dopóki nie zostanie kliknięty przycisk. Jeśli wtyczka nie zostanie zainicjowana, nie będzie sprawdzania poprawności.

$("#btn").click( function() { $("#form1").validate();});

Zamiast, .validate() zostaje wywołany w DOM gotowy zainicjować wtyczka w formularzu.

Jeśli chcesz test formularz w dowolnym momencie po inicjalizacji, użyjesz .valid() metoda.

$(document).ready(function () {

$("#form1").validate({ // initialize plugin
// your options
});

$("#btn").click( function() {
$("#form1").valid();  // test the form for validity
});

});

Nie mam pojęcia, w jaki sposób skonfigurowałeś każdą część do interakcji ze sobą lub jaki inny kod jest używany. Na podstawie samego OP, oto działający przykład wykorzystujący moją odpowiedź powyżej.

PRÓBNY: http://jsfiddle.net/pqVJM/

$(document).ready(function () {

$("#form1").validate();

$("#btn").click(function () {
if ($("#form1").valid()) {
alert("hello - valid form");
}
});

});