Question

我正在使用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必须运行。使用无效的处理程序，他没有这样做，因为这是在错误显示之前运行的......任何人都有任何想法？

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");

    }


}

Answer 1

尝试提交整个表单时会调用

invalidHandler函数。尝试将回调函数放在showErrors上：

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

从此链接获取Invalid handler callback for jquery validation

使用jquery验证显示错误后的函数

1 个答案: