0

我有一个带有 4 个选项卡的表单,我希望能够在用户单击任何其他选项卡时切换到新选项卡之前验证当前选项卡。这是我到目前为止所拥有的:

$("#tabs").tabs({
            beforeActivate: function(event, ui) {

                var tab = ui.oldTab.index();
                var valid = true;

                if (tab == 0 && ($('#txbYPSchool').val() == "" || $('#txbYPSubjectDesc').val() == "")) {

                    valid = false;
                };


                if (!valid) {
                    //alert('not valid');

                    event.preventDefault();
                }
                else {
                    alert('valid');
                }
            }
        });

如果某些字段未填写,上述功能可防止用户选择不同的选项卡。我也有验证功能设置如下:

$("#form1").validate({

            rules: {

                txbYPSchool: { required: true, nowhitespace: true },
                txbYPSubjectDesc: { required: true, nowhitespace: true }

            },

            messages: {

                txbYPSchool: "*This field is mandatory. If not in school, type 'Not in School'",  
                txbYPSubjectDesc: "*This field is mandatory"

            },

            ignore: ""
        });

当当前选项卡上仍有不完整的字段时,当用户尝试更改选项卡时,如何运行验证并显示错误消息?我希望能够在不单击按钮的情况下执行此操作,并且仅当用户尝试更改选项卡但我不知道如何将验证功能合并到第一个功能中时。

我正在使用 jquery 1.9.1 和最新的验证插件。

谢谢

4

1 回答 1

1

您可以使用插件的.valid()方法

换这个...

if (!valid) {

有了这个...

if !($("#form1").valid()) {

然后由于插件正在检查有效性,你可以摆脱这一切......

var valid = true;
if (tab == 0 && ($('#txbYPSchool').val() == "" || $('#txbYPSubjectDesc').val() == "")) {
   valid = false;
};
于 2013-07-15T16:03:25.623 回答