多无线电组验证

时间:2014-03-23 08:07:59

标签: javascript jquery validation

我正在尝试验证多个单选按钮组,并且在验证之后应该提交表单。验证工作正常,但已提交,请帮助。

<form action="" method="post" name="surveyForm" id="surveyForm" onSubmit="return checkdata();">
    <div>
        <input class="attrInputs" type="radio" name="chest" value="A">
        <input class="attrInputs" type="radio" name="chest" value="B">
        <input class="attrInputs" type="radio" name="chest" value="C">
    </div>
    <br />
    <div>
        <input class="attrInputs" type="radio" name="chest1" value="A">
        <input class="attrInputs" type="radio" name="chest1" value="B">
        <input class="attrInputs" type="radio" name="chest1" value="C">
    </div>
    <br />
    <input type="submit" value="click" onclick="return checkdata()" />
</form>
<script>
    function checkdata() {
        return checkdata1_2();
        return checkdata1_1();
    }
    function heckdata1_2() {
        if ($('input[name=chest]:checked').length <= 0) {
            alert("No radio checked");
            return false;
        }
    }
</script>
<script>
    function checkdata1_1() {
        if ($('input[name=chest1]:checked').length <= 0) {
            alert("No radio checked");
            return false;
        }
    }
</script>

2 个答案:

答案 0 :(得分:1)

问题是多个return声明。它将从第一个return语句返回,并且不会检查下一行代码。我认为,当你可以在一个功能中完成所有功能时,甚至不需要两个功能。

这将是一个简单的方法:

<form action="" method="post" name="surveyForm" id="surveyForm" onsubmit="return checkdata();">
<div>
    <input class="attrInputs" type="radio" name="chest" value="A">
    <input class="attrInputs" type="radio" name="chest" value="B"><input class="attrInputs"
        type="radio" name="chest" value="C"></div>
<br />
<div>
    <input class="attrInputs" type="radio" name="chest1" value="A"><input class="attrInputs"
        type="radio" name="chest1" value="B">
    <input class="attrInputs" type="radio" name="chest1" value="C"></div>
<br />
<input type="submit" value="click" onclick="return checkdata()" /></form>
<script>
    function checkdata() {
        if ($('input[name=chest]:checked').length <= 0) {
            alert("No radio checked");
            return false;
        }
        if ($('input[name=chest1]:checked').length <= 0) {
            alert("No radio checked");
            return false;
        }
    }
</script>

检查Fiddle

答案 1 :(得分:0)

或者只是使用以下功能。这将检查是否检查了leaast 2单选按钮,这意味着每组中有1个。因此,只有当从每个组中选中至少1个单选按钮时,您的表单才会提交。

演示:Fiddle

JS:

function checkdata() {
    if ($('input[name^="chest"]:checked').length < 2) {
        alert("No radio checked");
        return false;
    }
    return true;
}