动态添加验证规则 [英] Dynamically add validation rules

问题描述

我有一个插件，该插件通常可处理用于CRUD操作的jQuery对话框的创建.添加到对话框中的表单的标记可在插件代码的外部使用，并且插件仅要求提供http服务以提供标记，并且在收到标记后，只需将其添加到对话框本身即可.

I have a plugin which generically handle the creation of a jQuery dialog used for CRUD operations. The markup of the form that is added to the dialog is available externally of the plugin code and the plugin just ask to an http service to provide the markup and when received simply add it to the dialog itself.

然后我在插件中创建了一个回调(onSetupValidation函数)，该回调旨在作为插件用户为每种表单自定义验证的句柄.这是我正在使用的代码示例

I have then created a callback in the plugin (onSetupValidation function) which is meant to be the handle for the plugin user to customize the validation for each form. This is an example of code I am using

var element = $('#mydiv');
element.crudplugin({
    [...]
    onSetupValidation: function(markup) {
        var form = $('#myForm', markup);
        var container = $('<div class="error"><p>Errors were found validating your form. Please correct them and retry.</p><ol></ol></div>')
                       .appendTo(form).hide();
        var validator = form.validate({
            errorContainer: container,
            errorLabelContainer: $('ol', container),
            errorElement: 'em',
            wrapper: 'li',
            highlight: function (element) {
                $(element).addClass("ui-state-error");
            },
            unhighlight: function (element) {
                $(element).removeClass("ui-state-error");
            },
            submitHandler: function (form) {
                [...]
            }
        });
    }
    [...]
});

好吧.让我们去解决问题

Well. Let's go to the problems

1. 如果我将验证规则添加到标记中(作为类属性)，则验证根本无法进行.如果在validate()方法中添加规则，则行为相同

2. 在Google上搜索时发现了很多示例，尤其是在SO上，它们使用.rules('add', rule)方法/"rel =" nofollow>验证插件，如以下示例中所示，所有这些链接建议在添加如以下示例中的任何规则之前先调用validate方法

1. If I add the validation rules inside the markup (as class attributes) validation does not work at all. Same behaviour if I add the rules in the validate() method

2. Googling around I have found many samples, expecially here on SO, that uses the .rules('add', rule) method of the validation plugin like in the following sample and all these links recommends to call the validate method before adding any rule like in the following sample

$("#myField", markup).rules("add", { required: true });

但是，如果在执行指令时使用此方法，则会出现以下错误:

But if I use this method when the istruction get executed I get the following error:

SCRIPT5007:无法获取属性设置"的值:对象为 空或未定义的jquery.validate.min.js，第15行字符257

SCRIPT5007: Unable to get value of the property 'settings': object is null or undefined jquery.validate.min.js, line 15 character 257

有什么建议吗?

推荐答案

您绝对是正确的.

关键是您必须先在表单上调用validate，然后才能将规则添加到表单中的各个字段.

The key is that you have to have called validate on the form before you add rules to individual fields within the form.

如果您想查看触发这种情况的示例，则可以查看我对上一个问题的回答 (或者特别是 jsfiddle ).在该jsfiddle中，如果您注释掉javascript的最后4行($('#myForm').validate({/* ... */});)，它将触发您所看到的相同错误消息.

If you want to see an example where this case is triggered, you can check out my answer to a previous question (or specifically the jsfiddle). In that jsfiddle, if you comment out the last 4 lines of javascript ($('#myForm').validate({/* ... */});) it will trigger the same error message that you are seeing.

您的问题也不清楚，但是您有可能在表格可见之前调用了validate?如果是这样，机会就没有帮助...

It's also not clear from your question, but it's possible that you're calling validate before the form is visible? If so, chances are that isn't helping...

这篇关于动态添加验证规则的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！