我已经创建了波纹管表格验证脚本,但没有工作我每次都会收到#34;没有选择项目"。有什么问题可以帮我解决这个问题。
我的代码:
<script type="text/javascript">
function ValidateSchool(form){
var cat_school = document.getElementsByName('school[]');
for (i = 0; i < cat_school.length; i++){
if (cat_school[i].checked == true){
return true;
}else{
alert('No item selected');
return false;
}
}
}
</script>
<form name="frm" method="post" action="#" onsubmit="return ValidateSchool(this)">
<div class="TopAlphaWrapper">
<div id="topMainAlpha">
<div id="TopAlphaOneLeft">
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Admiralty Primary School" style="display: block;">
<label id="lbl_type0" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.442917,103.799744" type="checkbox">
Admiralty Primary School</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Admiralty Secondary School" style="display: block;">
<label id="lbl_type1" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.446367,103.801608" type="checkbox">
Admiralty Secondary School</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Advent Learning" style="display: block;">
<label id="lbl_type2" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.324952,103.851188" type="checkbox">
Advent Learning</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="AEC Business School" style="display: block;">
<label id="lbl_type3" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.282717,103.818904" type="checkbox">
AEC Business School</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Ahmad Ibrahim Primary School " style="display: block;">
<label id="lbl_type4" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.43367,103.832723" type="checkbox">
Ahmad Ibrahim Primary School </label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Ahmad Ibrahim Secondary School" style="display: block;">
<label id="lbl_type5" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.436482,103.829649" type="checkbox">
Ahmad Ibrahim Secondary School</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Ai Tong School" style="display: block;">
<label id="lbl_type6" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.360415,103.832615" type="checkbox">
Ai Tong School</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Al-Mubarakah Tuition Centre" style="display: block;">
<label id="lbl_type7" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.352244,103.954274" type="checkbox">
Al-Mubarakah Tuition Centre</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Alps Academia" style="display: block;">
<label id="lbl_type8" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.33079,103.9485" type="checkbox">
Alps Academia</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="American College" style="display: block;">
<label id="lbl_type9" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.280777,103.805617" type="checkbox">
American College</label>
</div>
</div>
</div>
</div>
<input type="submit" name="submit" value="Submit" />
</form>
有任何想法或建议吗?感谢。
答案 0 :(得分:4)
您的验证逻辑似乎存在缺陷,我可以理解您要检查是否至少检查了一个项目
function ValidateSchool(form) {
var cat_school = document.getElementsByName('school[]');
var valid = false;
for (i = 0; i < cat_school.length; i++) {
if (cat_school[i].checked == true) {
valid = true;
break;
}
}
if (!valid) {
alert('No item selected');
}
return valid;
}
问题在于您的逻辑是,如果未选中第一个复选框,则显示警报并返回false,而不是循环遍历列表的其余部分以查看是否已检查任何其他项目
答案 1 :(得分:0)
试试这个: -
<script type="text/javascript">
function ValidateSchool(form) {
var cat_school = document.getElementsByName('school[]');
var valid = false;
for (i = 0; i < cat_school.length; i++) {
if (cat_school[i].checked == true) {
valid = true;
break;
}
}
if (!valid) {
alert('No item selected');
}
return valid;
}
</script>
<form name="frm" method="post" action="#" onsubmit="return ValidateSchool(this)">
<div class="TopAlphaWrapper">
<div id="topMainAlpha">
<div id="TopAlphaOneLeft">
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Admiralty Primary School" style="display: block;">
<label id="lbl_type0" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.442917,103.799744" type="checkbox">
Admiralty Primary School</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Admiralty Secondary School" style="display: block;">
<label id="lbl_type1" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.446367,103.801608" type="checkbox">
Admiralty Secondary School</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Advent Learning" style="display: block;">
<label id="lbl_type2" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.324952,103.851188" type="checkbox">
Advent Learning</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="AEC Business School" style="display: block;">
<label id="lbl_type3" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.282717,103.818904" type="checkbox">
AEC Business School</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Ahmad Ibrahim Primary School " style="display: block;">
<label id="lbl_type4" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.43367,103.832723" type="checkbox">
Ahmad Ibrahim Primary School </label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Ahmad Ibrahim Secondary School" style="display: block;">
<label id="lbl_type5" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.436482,103.829649" type="checkbox">
Ahmad Ibrahim Secondary School</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Ai Tong School" style="display: block;">
<label id="lbl_type6" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.360415,103.832615" type="checkbox">
Ai Tong School</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Al-Mubarakah Tuition Centre" style="display: block;">
<label id="lbl_type7" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.352244,103.954274" type="checkbox">
Al-Mubarakah Tuition Centre</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="Alps Academia" style="display: block;">
<label id="lbl_type8" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.33079,103.9485" type="checkbox">
Alps Academia</label>
</div>
<div class="email_alert_checkbx_list filter-div ln-a" data-filter="American College" style="display: block;">
<label id="lbl_type9" class="label_check c_off" name="school" style="width:230px !important;">
<input name="school[]" class="chkBX" value="1.280777,103.805617" type="checkbox">
American College</label>
</div>
</div>
</div>
</div>
<input type="submit" name="submit" value="Submit" />
</form>
希望它有效:)
答案 2 :(得分:0)
在checkBox的第一个值的代码中,只执行返回语句只有问题
试试这个fiddle
function ValidateSchool(form){
var cat_school = document.getElementsByName('school[]');
var j=0;
for (i = 0; i < cat_school.length; i++){
if (cat_school[i].checked){
j++;
}
}
if(j>0){
alert("item selected");
return true;
}
else{
alert("select atleast one value");
return false;
}
}