JQuery验证<select> min取决于其他字段,而不是</select>

时间:2014-11-28 22:28:37

标签: javascript jquery jquery-validate

我有一个选择&#34; ArrearsLHOLocation&#34;有一个选项&#34;没有选择&#34;值为-1,所有其他可选值都大于0.

这是我的javascript中定义的规则

    $("#ArrearsLHOLocation").rules("add", {
        min: {
            depends: function (elem) {
                return $("#rbArrearsLHO[value='True']").is(":checked") ? 0 : -1;
            }
        },
        messages: {
            min: "You have stated that the applicant/coapplicant have LHO arrears but you have not stated where!"
        }
    });

以下是Chrome中观察到的手表。

 $("#rbArrearsLHO[value='True']").is(":checked") ? 0 : -1: 0
 $("#rbArrearsLHO[value='True']").is(":checked"): true
 $("#ArrearsLHOLocation").val(): "-1"
 $("#ArrearsLHOLocation").val() >=($("#rbArrearsLHO[value='True']").is(":checked") ? 0 : -1): false

此页面成功提交错误。如果我切换单选按钮,手表显示如下:

 $("#rbArrearsLHO[value='True']").is(":checked") ? 0 : -1: -1
 $("#rbArrearsLHO[value='True']").is(":checked"): false
 $("#ArrearsLHOLocation").val(): "-1"
 $("#ArrearsLHOLocation").val() >=($("#rbArrearsLHO[value='True']").is(":checked") ? 0 : -1): true

停止提交此页面并显示我的错误消息。

我做错了什么?

史蒂夫

- 根据要求提供HTML代码段 -

<td>Do they have arrears?</td><td>
Yes <input id="rbArrearsLHO" name="rbArrearsLHO" type="radio" value="True" />
No <input checked="checked" id="rbArrearsLHO" name="rbArrearsLHO" type="radio" value="False" />
</td>
</tr>
<tr>
 <td colspan="2">
   <blockquote>
    If YES, Where? 
       <select data-val="true" data-val-number="The field ArrearsLHOLocation must be a number." id="ArrearsLHOLocation" name="ArrearsLHOLocation">
            <option value="-1">None Selected</option>
            <option value="4">Location 1</option>
            <option value="6">Location 2</option>
            <option value="5">Location 3</option>
            <option value="7">Location 4</option>
       </select>
   </blockquote>
 </td>
</tr>

2 个答案:

答案 0 :(得分:1)

select只能是required。我从未见过min上使用的select规则强制用户选择选项。

您的"None Selected"选项应包含value="",然后在您声明required规则时,用户将被迫选择除"None Selected"以外的任何选项。< / p>

<select name="list">
    <option value="">None Selected</option>
    <option value="1">option 1</option>
    <option value="2">option 2</option>
    <option value="3">option 3</option>
</select>

然后你的depends参数只需要返回一个布尔值来说明用户是否需要选择一个选项。

$('[name="list"]').rules("add", {
    required: {
        depends: function (elem) {
            return $("#check").is(":checked");
        }
    },
    messages: {
        required: "Select from the list"
    }
});

DEMO:http://jsfiddle.net/7k2zg7rv/


修改

由于您希望将第一个option保留为value="-1",因此您需要使用the addMethod() method创建一个自定义规则/方法,将您的第一个option识别为无效

$.validator.addMethod('select', function(value, element) {
    return (value == -1) ? false : true;
});

更新了DEMO:http://jsfiddle.net/7k2zg7rv/2/

答案 1 :(得分:0)

查看jquery.validate我发现依赖只能评估为true / false。所以修改min以使[param:0]在我需要它的时候就是最小值。然后,当最小值应该有效地解决了这个问题时,改变取决于评估为真。

$("#ArrearsLHOLocation").rules("add", {
        min: {
            param: 0,
            depends: function (elem) {
                return $("#rbArrearsLHO[value='True']").is(":checked");
            }
        },
        messages: {
            min: "You have stated that the applicant/coapplicant have LHO arrears but you have not stated where!"
        }
    });

DEMO FIDDLE(来自@ Sparky之前的小提琴)