jQuery验证插件复选框验证

时间:2011-07-03 06:45:20

标签: jquery-validate

我需要验证表单。我正在使用jQuery验证插件,但我似乎无法使其正常工作。

<form id="form1" name="form1" action=<?=$_SERVER['PHP_SELF'];?> method="POST">
<div>
        <h3>Cardio-Pulmonary System</h3>
        <div style="border: medium none;display: inline;padding: 0;text-align:left">
        <h4>1. Do you have, or have you had, or do you take medications for?</h4>
        <label><input class="checkbox" type="checkbox" value="none" name="q1[]" />no / or none of the below</label>
        <p><input class="checkbox" type="checkbox" value="q1-1" name="q1[]" />heart disease (please specify)
        <input class="checkbox" type="text" id="text" name="q1-1" value="" /></p>
        <p><input class="checkbox" type="checkbox" value="high blood pressure" name="q1[]" />high blood pressure</p>
        <p><input class="checkbox" type="checkbox" value="high cholesterol" name="q1[]" />high cholesterol</p>
        <p><input class="checkbox" type="checkbox" value="diabetes" name="q1[]" />diabetes</p>
        <p><input class="checkbox" type="checkbox" value="q1-2" name="q1[]" />lung disorder (eg asthma, emphysema)
        <input class="checkbox" type="text" id="text" name="q1-2" value="" /></p>
        <p><input class="checkbox" type="checkbox" value="other cardiac problem" name="q1[]" />other cardiac problem (include pacemaker)</p>

        <h4>2. Do you have a family history of?</h4>
        <p><input type="checkbox" value="none" name="q2[]" />no / or none of the below</p>
        <p><input type="checkbox" value="heart murmur" name="q2[]" />heart murmur</p>
        <p><input type="checkbox" value="valve defect" name="q2[]" />valve defect</p>
        <p><input type="checkbox" value="racing heart" name="q2[]" />racing heart</p>
        <p><input type="checkbox" value="irregular beats" name="q2[]" />irregular beats</p>
        <p><input type="checkbox" value="angina" name="q2[]" />angina</p>
        <p>other<br/><input type="text" id="text" value="" name="q2[]" /></p>

        <h4>3. Have you ever been told that you have heart problems? Eg</h4>
        <p><input type="checkbox" value="none" name="q3[]" />no / or none of the below</p>
        <p><input type="checkbox" value="heart disease" name="q3[]" />heart disease</p>
        <p><input type="checkbox" value="high blood pressure" name="q3[]" />high blood pressure</p>
        <p><input type="checkbox" value="high cholesterol" name="q3[]" />high cholesterol</p>
        <p><input type="checkbox" value="diabetes" name="q3[]" />diabetes</p>
        <p><input type="checkbox" value="stroke" name="q3[]" />stroke</p>

        <h4>4. Do you have, or have you experienced?</h4>
        <p><input type="checkbox" value="none" name="q4[]" />no / or none of the below</p>
        <p><input type="checkbox" value="epilepsy" name="q4[]" />epilepsy</p>
        <p><input type="checkbox" value="fainting" name="q4[]" />fainting</p>
        <p><input type="checkbox" value="seizures" name="q4[]" />seizures</p>
        <p><input type="checkbox" value="dizzy spells" name="q4[]" />dizzy spells</p>
        <p><input type="checkbox" value="convulsions" name="q4[]" />convulsions</p>

        <h4>5. Have you ever smoked cigarettes?</h4>
        <p><input type="checkbox" value="q5-1" name="q5[]" />Yes, still do approx <input type="text" name="q5-1" style="width:20px" maxlength="3" /> a day</p>
        <p><input type="checkbox" value="q5-2" name="q5[]" />Yes, but stopped <input type="text" name="q5-2" style="width:20px" maxlength="3" /> months / <input type="text" name="q5-3" style="width:20px" maxlength="3" /> years ago. </p>
        <p><input type="checkbox" value="never" name="q5[]" />Never</p>
    </div>
    </form>

如何验证复选框,以便他们需要为每个问题选择至少一个?

这是我的表格... http://test9.favstay.com/form.php

2 个答案:

答案 0 :(得分:1)

使用最小和最大长度

<input type="checkbox" value="palin" name="upd" id="upd"/>
</p>
<p>
<label for="fox">Fox</label>
<input type="checkbox" value="fox" name="upd" id="upd" />
</p>
<p>
<label for="left">Left</label>
<input type="checkbox" value="left" name="upd" id="upd" />
</p>

验证

$("#upd").rules("add", {
        required: true,
        minlength: 1,
        maxlength: 1,
    messages: {
        required: "Please pick a category",
        minlength: jQuery.format("Please, Check at least one box"),
        maxlength: jQuery.format("Please, You checked too many boxes"),
    }
});

为每个复选框添加ID(q4,q5等),将q3,q4等替换为#upd。只需根据您的需求进行调整。

答案 1 :(得分:0)

您可以使用jquery验证插件来验证HTML表单,并验证复选框,您可以在验证选项中添加“自定义选择器”。查看示例here