Question

我正在使用jQuery验证来验证我的动态表单。我的html值为1,2,3,4。如果从下拉列表中选择1，则显示一个带有某个字段的div，如果选择2，则显示div1 +另一个带有一些新字段的div，依此类推3和4。

所有字段都以一种形式出现

<form name="client_basic_details" id="client_basic_details" method="post" action="...">
        <select  name="applicant_num" id="applicant_num">
                <option value="">-- Select --</option>
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>
        </select>
        <div id="applicant_1">
        <input type="text" name="app_1_fname" id="app_1_fname">
        <input type="text" name="app_1_mname" id="app_1_mname">
        <input type="text" name="app_1_lname" id="app_1_lname">
        </div>
        <div id="applicant_2">
        <input type="text" name="app_2_fname" id="app_2_fname">
        <input type="text" name="app_2_mname" id="app_2_mname">
        <input type="text" name="app_2_lname" id="app_2_lname">
        </div>
        <div id="applicant_3">
        ....
        </div>
        <div id="applicant_4">
        ...
        </div>
    </form>

选择框的更改我将可见性设置为div的真实，如

$("#applicant_num").change(function(){
hide("applicant_1");
hide("applicant_2");
hide("applicant_3");
hide("applicant_4");
for(var i=1; i<=$("#applicant_num").val(); i++)
    {
        var div_id = "applicant_"+i;
        show(div_id);
            //if loop given below lies here
    }
});

与此同时我将验证规则添加到字段

if(i==1)
    {
        $('#applicant1_salutation').rules('add','required');
        $('#applicant1_initial').rules('add','required');
        $('#applicant1_suffix').rules('add','required');
        $('#applicant1_fname').rules('add','required');
        $('#applicant1_lname').rules('add','required');
        $('#applicant1_dob').rules('add','required');
        $('#applicant1_marital_status').rules('add','required');
        $('#applicant1_work').rules('add','required');
        $('#applicant1_no_dependant').rules('add','required');
        $('#applicant1_sin').rules('add','required');
        $('#applicant1_fax').rules('add','required');
        $('#applicant1_cont_method').rules('add','required');
    }
    if(i==2)
    {

    }
    if(i==3)
    {

    }
    if(i==4)
    {

    }

前5个选项规则被附加到验证方法但在此之后我在控制台中收到此错误

TypeError：元素未定义

var settings = $ .data（element.form，'validator'）。settings;

而不是按我使用的每个语句添加规则this option 但它与上述错误信息的结果相同。

请建议。

我在document.ready function

中添加了validate方法

编辑：

在这里小提琴：http://jsfiddle.net/E4rua/4/

我想为其他表单添加规则，例如2,3,4

PS

我在这里遇到的最大问题是：

在比较中很明显，默认情况下，jquery验证器忽略1.9版本中的所有隐藏元素，而1.8确实验证页面中的每个控件，无论它们是可见还是不可见。

Re.

Answer 1

要向隐藏输入添加规则，您必须忽略隐藏属性：

$.validator.setDefaults({ ignore: []});

Answer 2

只需将规则添加到其他字段的验证调用中。默认行为是，当它们不可见时，它们将不会被验证，但是当它们可见时，它们将被验证。我想这就是你想要的。

因此，如果将其添加到规则对象中：

        applicant2_salutation: {
                    required: true
            }

这将导致＆＃34;称呼＆＃34;是必需的，但只有当申请人2可见时才会出现。

工作示例：http://jsfiddle.net/ryleyb/E4rua/5/

动态添加规则到jquery validate会产生错误

2 个答案: