2017-04-26 53 views
0

我正在使用jquery驗證。由於顯示的錯誤,我只有一點設計問題。 我現在代碼:錯誤後顯示的功能與jQuery驗證

$('#form1').validate({ 
    rules: { 
     txtNaam: { required: true }, 
     txtVoornaam: { required: true }, 
     txtDatum: { required: true }, 
     //rdbMan: { require_from_group: [1, ".optionsRadio"] }, 
     //rdbVrouw: { require_from_group: [1, ".optionsRadio"] }, 
     txtINSZ: { 
      required: $('cbInxsz').prop('checked') 
     }, 
     txtGeboorteP:{required: $('cbInxsz').prop('checked')}, 
     txtStraat: { required: $('cbInxsz').prop('checked') }, 
     txtNr: { required: $('cbInxsz').prop('checked') }, 
     txtBNummer: { required: $('cbInxsz').prop('checked') }, 
     txtPost: { required: $('cbInxsz').prop('checked') }, 
     txtWoonP: { required: $('cbInxsz').prop('checked') } 
    }, 
    messages: { 
     txtNaam: { 
      required:'Please fill in name' 
     } 
    }, 
    submitHandler:function(form){ 
     checkWidth(); 
     alert("gg"); 
    }, 
    invalidHandler: function (event, validator) { //resize because of the errors that are being displayed 
     checkWidth(); 
}, 

}); 

現在,當顯示我的功能checkWidth具有運行錯誤的問題。與invalidhandler他不這樣做,因爲這是在錯誤顯示之前運行...任何人有任何想法?

CheckWidth功能可按:當您嘗試提交整個表單

function checkWidth() { 
    w = $window.width(); 

    if (w <= 650) { 
     //width smaller then 650 pixels divs above each other and button in the middle 
     $('#div1').removeClass('col-xs-6'); 
     $('#div1').addClass('col-xs-12'); 
     $('#div2').removeClass('col-xs-6'); 
     $('#div2').css('height', 'auto'); 
     $("#divButton").removeClass("text-right"); 
     $("#divButton").addClass("text-center"); 
     $('#btnSubmit').addClass("col-xs-6"); 
     $('#btnSubmit').removeClass("col-xs-2"); 

    } 
    else { 
     //bigger => divs next to each other and button in the right corner 
     $('#div1').addClass('col-xs-6'); 
     $('#div1').removeClass('col-xs-12'); 
     $('#div2').addClass('col-xs-6'); 
     $("#div2").height($("#div1").height()); 
     $("#divButton").addClass("text-right"); 
     $("#divButton").removeClass("text-center"); 
     $('#btnSubmit').addClass("col-xs-2"); 
     $('#btnSubmit').removeClass("col-xs-6"); 

    } 


} 
+0

的代碼似乎確定,你有沒有收到任何錯誤在JavaScript控制檯?嘗試在checkWidth()調用後刪除關閉後的最後一個逗號}。 – NetVicious

+0

@NetVicious沒有什麼......提交處理程序是它的工作思路。我刪除了逗號,但沒有發生任何事情。 – Squarkz

+0

當你得到一個錯誤的表單時,它會運行alert('gg')嗎?請編輯您的問題並粘貼checkWidth()函數。 – NetVicious

回答

0

invalidHandler函數被調用。嘗試把回調函數上showErrors:

showErrors:function(errorMap,errorList){ 
    checkWidth(); 
    this.defaultShowErrors();  // to display the default error placement 
} 

得到它從這個鏈接Invalid handler callback for jquery validation

+1

我不得不放置this.defaultShowErrors();在我自己的功能之前,但它現在工作:)非常感謝你的時間! – Squarkz