Question

我正在使用jquery.validate在提交给服务器之前验证一些输入字段，客户端。它很棒！这一特定字段组以模态显示，页面上有两个其他模态在不同时间弹出，具体取决于用户点击的内容;但是，我的验证仅在其中一个模态上，即使该模态不在屏幕上，也阻止了我的服务器端提交。

下面是我在.js中用于模态处理的代码，我想要压缩的是“modalChgPass”。

(function (window) {
    var
   $ = window.jQuery,
   modalEdit = '#modal-preferences-edit',
     modalPreferencesEditOpts = {
         autoOpen: true,
         modal: true,
         resizable: false,
         draggable: false,
         width: '700',
         height: '670',
         dialogClass: 'modal',
         appendTo: 'form',
         close: function () { $(this).dialog('destroy'); }
     };



    modalChgPass = '#modal-password-change',
    modalPasswordChangeOpts = {
        autoOpen: true,
        modal: true,
        resizable: false,
        draggable: false,
        width: '450',
        height: '550',
        dialogClass: 'modal',
        appendTo: 'form',
        close: function () { $(this).dialog('destroy'); }
    };


    modalActive = '#modal-card-activate',
    modalCardActivateOpts = {
         autoOpen: true,
         modal: true,
     resizable: false,
     draggable: false,
     width: '700',
     height: '265',
     dialogClass: 'modal',
     appendTo: 'form',
     close: function() { $(this).dialog('destroy'); }
    };



    $(document).ready(function () {
        $('#btn-modal-password-change').click(function () {
            $(modalChgPass).dialog(modalPasswordChangeOpts);
            $(modalChgPass).dialog('open');
            $('.ui-widget-overlay').click(function () {
                $('.ui-dialog-content').dialog('close');
            });
            return false;
        });

        $('#chg-Password-btn').click(function () {
            $(modalChgPass).dialog(modalPasswordChangeOpts);
            $(modalChgPass).dialog('open');
            $('.ui-widget-overlay').click(function () {
                $('.ui-dialog-content').dialog('close');
            });
            return false;
        });

        $('#btn-modal-card-activate').click(function () {
            $(modalActive).dialog(modalCardActivateOpts);
            $(modalActive).dialog('open');
            $('.ui-widget-overlay').click(function () {
                $('.ui-dialog-content').dialog('close');
            });
            return false;
        });

        $('#btn-modal-preferences-edit').click(function () {
            $(modalEdit).dialog(modalPreferencesEditOpts);
            $(modalEdit).dialog('open');
            $('.ui-widget-overlay').click(function () {
                $('.ui-dialog-content').dialog('close');
            });
            return false;
        });

        });


    window.RCC = window.RCC || {};
})(window);

以下是带有验证的.js：

var $ = jQuery;
    $.validator.addMethod('mypassword', function (value, element) {
        return this.optional(element) || (value.match(/[a-zA-Z]/) && value.match(/[0-9]/));
    },
'Password must contain at least one number.');



$(document).ready(function () {
    $("#form1").validate({
        rules: {
            ChgPass$CurrentPass: {
                required: true
            },
            ChgPass$NewPass: {
                required: true,
                minlength: 8,
                maxlength: 16,
                mypassword: true

            },
            ChgPass$ConfirmPass: {
                equalTo: "#ChgPass_NewPass"
            }
        }

    });
});

如何禁用“modalChgPass”以允许“modalActive”和“modalEdit”处理？提前感谢您的协助。问候，

Answer 1

执行所需操作的最佳方法可能是使用插件的ignore选项。如果这是你想要的话，请检查link

修改1

也许是这样的：

迭代要禁用的模态的函数。

当您显示要禁用/启用其他模态

的主模式时，将调用此函数

     function TogglePanelValidation (panel, enabled) {

      panel.find("input, select").each(function () {
       var thisobj = $(this);

        if (!enabled) {
                $(this).addClass('ignore').removeClass('yourinput class');

        } else {
            if ($this.hasClass('ignore')) {
                $this.removeClass('ignore').addClass('yourinput class')
            }
        }
    });
   }

Answer 2

您无法动态“启用”和“禁用”表单上的插件。在您致电.validate()初始化字段规则后，您对.validate()的任何后续调用都将被忽略。

但是，the .rules('add') and .rules('remove') methods将允许您无限制地快速动态地添加和删除任何字段上的规则。

我的简单演示加载了.validate()中声明的规则。然后，在单击按钮时，通过从该部分删除所有规则，有效地禁用某些字段的验证。

概念证明DEMO：http://jsfiddle.net/xfSs5/

Answer 3

以下代码可以避免jquery.validate（）关键是伪造规则，这仅适用于一种模式。

  $('#btn-modal-card-activate').click(function () {
        settings = $('#form1').validate().settings;
        for (var i in settings.rules) {
            settings.rules[i].required = false;
        }
        $(modalActive).dialog(modalCardActivateOpts);
        $(modalActive).dialog('open');
        $('.ui-widget-overlay').click(function () {
            $('.ui-dialog-content').dialog('close');
        });
        return false;
        });

禁用特定字段的jquery.validate功能

3 个答案: