jquery - ColdFusion 动态循环与 jQuery 验证插件创建动态规则

Question

我正在使用 jQuery 验证插件。我有一个基于 1-5 创建的动态表单，具体取决于用户为循环选择的数字。我正在努力编写动态部分以使每个表单字段在每个循环上正确工作。

<!--- Looping Validation --->
<script>
     $("#form").validate({
         focusCleanup: true,
         focusInvalid: false,
    rules: {
phoneNumber_<cfoutput>#Add#</cfoutput>: {
            required: true,
            validatePhone: true
        },
},
        // Same for other fields
    messages: {
phoneNumber_<cfoutput>#Add#</cfoutput>: "This field is required.",
        // Repeat for other fields
    }
});

因此，我尝试创建的第一个示例，该规则有效，但仅当它循环一次时。如果用户选择两个或更多，则仅适用于第一个循环，而不适用于第二个或更高的循环。

// Validates Phone Number
jQuery.validator.addMethod("validatePhone", function(value, element) {
    return this.optional(element) || /^(\([0-9]{3}\) |[0-9]{3}-)[0-9]{3}-[0-9]{4}$/.test(value);
}, 'Please enter valid Phone Number.');

然后我尝试了这个，它破坏了正则表达式，并且只尝试在第一个循环上进行验证。

// Validates Phone Number
jQuery.validator.addMethod("validatePhone", function(phoneNumber_<cfoutput>#Add#</cfoutput>) {
    var value = new RegExp("^(\([0-9]{3}\) |[0-9]{3}-)[0-9]{3}-[0-9]{4}$");
    return phoneNumber_<cfoutput>#Add#</cfoutput>.match(value);
}, 'Please enter valid Phone Number.');

对此的任何帮助将不胜感激!预先感谢您!

Answer 1

I am using the jQuery Validation Plugin. I have a dynamic form that is created based on 1-5 depending on what number the user chooses for the loop. I am struggling on writing the dynamic portion to make each form field work correctly on each loop.

你所说的“循环”到底是什么？我看到你的代码中没有循环。您不能在同一表单上多次调用 .validate() 方法。您只需在表单上一次调用 .validate() 方法即可初始化插件。 所有后续调用都将被忽略。表单数据的实际验证将根据插件自动捕获的事件自动进行。不需要循环，并且在这里完全没有用处。

如果您需要在动态创建的字段元素上声明规则，您可以调用 the .rules() method创建新字段后立即，以及 .validate() 之后的任何时间。

定位所有“以”phoneNumber_... 开头的字段

$('input[name^="phoneNumber_"]').each(function() {
    $(this).rules('add', {
        required: true,
        validatePhone: true,
        messages: {  // optional
            required: "custom message for required",
            validatePhone: "custom message for validatePhone"
        }
    });
});