jQuery验证以确保至少有一个单选按钮值为真

我有一个表单有两个问题。第一个问题是询问产品价值是否大于一定的固定金额，第二个问题是询问产品价值是否低于固定金额。当用户尝试提交表格时，应验证表格以确认至少有一个问题已被回答为是。如果两个问题都回答为否，则表单有效属性$("#form").valid()应该为false，并且应该在页面上显示包含错误消息的div。我怎样才能实现这个使用jQuery验证？jQuery验证以确保至少有一个单选按钮值为真

形式的简化版本看起来像

<form id="billing" method="POST"> 
    <div> 
     <label for "billAmountLess">Value is less than 1000</label> 
     <input id="billAmountLessY" name="billAmountLess" type="radio" required value="True"> 
     <label for "billAmountLessY">Yes</label> 
     <input id="billAmountLessN" name="billAmountLess" type="radio" required value="False"> 
     <label for "billAmountLessN">No</label> 
    </div> 
    <div> 
     <label for "billAmountMore">Value exceeds 1000</label> 
     <input id="billAmountMoreY" name="billAmountMore" type="radio" required value="True"> 
     <label for "billAmountMoreY">Yes</label> 
     <input id="billAmountMoreN" name="billAmountMore" type="radio" required value="False"> 
     <label for "billAmountMoreN">No</label> 
    </div> 
    <div id="errorDiv" style="display:none">Error!!!! 
    </div> 
    <div> 
     <input type="submit" value="Submit"> 
    </div> 
</form>

jQuery的验证，我试图为

$('#billing').validate({ 
    rules: { 
     billAmountMore: { 
      equalTo: { 
       param: '#billAmountMoreY', 
       depends: function(element) { 
        $("errorDiv").show(); 
        return $("#input[name='billAmountLess']:checked").val() == "false"; 
       } 
      } 
     } 
    } 
});

我创建了这个jsfiddle。

来源

2017-05-17 Tushar Kapoor

为什么你必须创建与每个两个选项的两个问题，而所有这一切是相关的？我只是把一个复选框指示它是否超过1000.这背后有什么技术原因吗？ – JMS786

我同意在这种情况下没有多大意义。我在这里简化了这个问题。但根据我们的要求，我们确实需要两组问题。就好像，用户可以有超过限制的东西或者低于限制的东西，或者满足两个标准的多个东西。但用户不能选择。我们检查后端执行的操作。 –

您可以使用此代码

function validate(){ 
     console.log($("input[name='billAmountLess']:checked").val()); 
     console.log($("input[name='billAmountMore']:checked").val()); 
    }

检索单选按钮值。

在你这行代码：

return $("#input[name='billAmountLess']:checked").val() == "false";

应该删除“＃”之前，“输入”，因为它是表示一个元素的“身份证”。也许这就是为什么它不起作用。

来源

2017-05-17 04:29:36 JMS786

简单的你可以在自定义验证功能中做到这一点。更新您的表单标签 -

<form id="billing" onsubmit="return validate();" method="POST">

然后 -

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script type="text/javascript"> 
    function validate(){ 
    var billLess = $("input[name='billAmountLess']:checked").val(); 
    var billMore = $("input[name='billAmountMore']:checked").val(); 
    if(billLess == "False" && billMore == "False"){ 
     $("#errorDiv").show(); 
     return false; 
    } 
    else{ 
     return true; 
    } 
    } 
</script>

来源

2017-05-17 04:46:01

jQuery验证以确保至少有一个单选按钮值为真

回答

相关问题