JQuery .validate сработал первым при второй отправке

Question

Я пытаюсь проверить форму. Форма генерируется динамически и добавляется в div на странице. При отправке формы я хочу, чтобы проверка проводилась сразу. Что происходит сейчас, так это то, что в первый раз, когда я отправляю форму, она публикуется без проверки. Во второй раз, когда я нажимаю «Отправить», это подтверждает.

Вот мой сценарий:

$("#registerform").live("submit", function(e){
                        //Prevent the form from submitting normally
                        e.preventDefault();
                       $("#registerform").validate({ 
                            rules: { 
                              firstname: "required",// simple rule, converted to {required:true} 
                              surname: "required",
                              //phonenumber: "required",
                              address: "required",
                             // address2: "required",
                              zipcode: "required",
                              username_ID: "required",
                              city: "required",
                              companyname: "required",
                              email: {// compound rule 
                              required: true, 
                              email: true 
                            }              
                            }, 
                            messages: { 
                              firstname: "Förnamn saknas" ,
                              surname: "Efternamn saknas",
                              address: "Adress saknas",
                             // address2: "required",
                              zipcode: "Postkod saknas",
                              username_ID: "Användarnamn saknas",
                              city: "Ort saknas",
                              companyname: "Företagsnamn saknas",
                              email: "Korrekt emailadress saknas"                             
                            } 
                          }); 
                        //alert("e");
                    $.post("registeraccount.php",$(this).serialize(),function(msg){
                    //alert the response from the server
                    //alert(msg);
            });
    });

Моя форма:

<form id='registerform' action='registeraccount.php' method='post'> 
            Ägare av konto</br>
            * Förnamn: <input type='text' name='firstname' /> <br/>
            * Efternamn: <input type='text' name='surname' /> <br/>
            * Email: <input type='text' name='email' /> <br/>
            * Telefon: <input type='text' name='phonenumber' /> <br/>
            Företagsinformation: </br>
            * Adress: <input type='text' name='address' /> <br/>
            Adress: <input type='text' name='address2' /> <br/>
            * Postnummer: <input type='text' name='zipcode' /> <br/>
            * Ort: <input type='text' name='city' /> <br/>

            <br/>
            Kontoinformation</br> 
            <div id='username_message'></div>
            * Användarnamn: <input id='username_ID' type='text' name='username' />

            <br/>
            Företagsinformation<br/>
            * Företagsnamn (som kunden kommer se det): <input type='text' name='companyname' /> <br/>
            Organisationsnummer: <input type='text' name='organisationnumber' /><br/>
            <input id='submitaccountregistration' type='submit' value='Submit Comment' /> 
        </form>

Почему это не сработало при первой отправке и как я могу получить проверку, выполняемую при первом обращении к отправке?

Answer 1

При первом отправлении события вы не проверяете форму, а просто подключаете к ней плагин валидатора. При втором представлении вы проверяете его и снова присоединяете подтверждение.

Просто определите функцию, которая добавляет вашу проверку (функция attachValidate (form) {$ (form) .validate ...}) и запускайте эту функцию, когда форма генерируется / загружается.

Answer 2

Я не уверен, но я думаю, что вы должны вызывать

$("#registerform").validate({ 
                            rules: { 
                              firstname: "required",// simple rule, converted to {required:true} 
                              surname: "required",
                              //phonenumber: "required",
                              address: "required",
                             // address2: "required",
                              zipcode: "required",
                              username_ID: "required",
                              city: "required",
                              companyname: "required",
                              email: {// compound rule 
                              required: true, 
                              email: true 
                            }              
                            }, 
                            messages: { 
                              firstname: "Förnamn saknas" ,
                              surname: "Efternamn saknas",
                              address: "Adress saknas",
                             // address2: "required",
                              zipcode: "Postkod saknas",
                              username_ID: "Användarnamn saknas",
                              city: "Ort saknas",
                              companyname: "Företagsnamn saknas",
                              email: "Korrekt emailadress saknas"                             
                            } 
                          }); 

вне функции click (конечно, поместите ее после добавления формы в DOM), чтобы присоединить проверку кФорма до ее отправки.В вашем случае кажется, что при первом нажатии вы устанавливаете проверку, которая вступает в силу при втором нажатии.

Answer 3

Вы использовали "pjax", если это так, вы должны поместить проверочный код в блок "pjax: end"

<script>
$(document).on('pjax:end', function () {
   $('#csv_form').validate();
});
</script>