Jak sprawdzić, czy sprawdzanie poprawności formularza HTML jest zakończone?

Question

Mam formularz, który używam html5 do sprawdzania poczty e-mail i wymaganych pól. Formularz należy przesłać za pośrednictwem ajax. Jak ustalić, że formularz przeszedł sprawdzanie poprawności, zanim pozwolę, aby formularz do przesłania za pośrednictwem ajax.

To jest mój HTML:

<form action="" method="post" id="comment_form"> 
    <input type="hidden" name="post_id" value="<?=$post->ID ?>" /> 
    <label for="name">Name</label> 
    <input type="text" name="name" required="required"> 

    <label for="email">Email Address</label> 
    <input type="email" name="email" required="required"> 


    <label for="comment">Comment</label> 
    <textarea name="comment" required="required" > 
    </textarea> 


    <label for="submit"></label> 
    <button type="submit"class="button green meduim" id="comment_btn">Submit</button> 
</form> 

To jest mój jQuery

$("#comment_btn").click(function(e){ 
    //the request url 
    var url = site_url+'comments/post_comment'; 
    //cross site request forgery token 
    var xtoken = $("input[name='xtoken']").val(); 
    //post data 
    var dataObj = { 
    "name":$('#name').val(), 
    "email":$("#email").val(), 
    "comment":$("#comment").val(), 
    "post_id":$("input[name='post_id']").val(), 
    "xtoken":xtoken 
    }; 
    //dim form 
    $('#comment_form').addClass('dim'); 
    //make request 
    $.ajax({ 
    url:url, 
    type:'POST', 
    data:dataObj, 
    dataType:'json', 
    error:function() {}, 
    success:function(resp) { 
     if(resp.status == "ok") 
     { 
     $('#comment_form').removeClass('dim'); 
     }else { 
     alert("An error was encountered"); 
     } 
    } 
    }); 
    e.preventDefault(); 
}); 

Czy istnieje sposób, aby ustalić, czy formularz jest zatwierdzony?

Answer 1

Można użyć funkcji sprawdzania poprawności form(), np.

var validator = $("#comment_form").validate(options); 
if (validator.form()) { 
    // submit with AJAX 
} 

Answer 2

To chyba najlepiej, aby nie polegać na przeglądarce do sprawdzania poprawności danych, na pewno za pomocą required i pattern jest chłodne i wszystko, ale nie będzie zależało od niego.

Napisz własną weryfikację do swojego javascript, zanim dane zostaną wysłane na adres URL. Możesz to zrobić z odrobiną Regex lub możesz użyć wielu dostępnych wtyczek walidacji jQuery, takich jak h5validate lub Validation.

Answer 3

nie wiążą się z przypadku kliknięcia przycisku Prześlij po prostu powiązać ze zdarzeniem przedstawienia swojej postaci:

$('#comment_form').submit(function(e){ 
    e.preventDefault(); 
    //submit via ajax 
}); 

Answer 4

Można zarejestrować do standardowej postaci „” onSubmit wydarzenie, które będą zwalniani, jeśli ma postać pomyślnie przeszedł sprawdzanie poprawności i jest wysyłany.

document.getElementById("comment_form").onsubmit = myPassedValidationHandler;