javascript验证无效

时间:2013-08-31 06:58:13

标签: javascript validation

我已经创建了波纹管表格验证脚本,但没有工作我每次都会收到#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>

有任何想法或建议吗?感谢。

3 个答案:

答案 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;
}

}