Javascript验证复选框和单选按钮

时间:2013-09-24 11:09:22

标签: javascript validation checkbox

我正在做一份清单,每当工作人员完成这个特定表格时,需要完成清单。请注意,由于没有大量的时间进行研究,我仍然在慢慢地抓住JS。

我做了一些研究并结合了一些不同的验证方式并提出了这个问题;

function validate(form) {
    var e = form.elements;

    if(e['reloaded'].value == "yes") {
        if(!e['Q1-A'].value) {
            alert('You Must complete the Checklist!');
            return false;
        }
        if(!e['Q1-B'].value) {
            alert('You Must complete the Checklist!');
            return false;
        }
        if(!e['Q1-C'].value) {
            alert('You Must complete the Checklist!');
            return false;
        }
        if(!e['Q1-D'].value) {
            alert('You Must complete the Checklist!');
            return false;
        }
        if(!e['Q1-E'].value) {
            alert('You Must complete the Checklist!');
            return false;
        }
        if(!e['Q1-G'].value) {
            alert('You Must complete the Checklist!');
            return false;
        }
        if(!e['Gen-A'].value) {
            alert('You Must complete the Checklist!');
            return false;
        }
        if(!e['Gen-B'].value) {
            alert('You Must complete the Checklist!');
            return false;
        }
        if(!e['invoice_number'].value) {
            alert('Invoice Number is REQUIRED!');
            return false;
        }
        return true;

    } else if(e['reloaded'].value == "no") {
        if(!e['Gen-A'].value) {
            alert('You Must complete the Checklist!');
            return false;
        }
        if(!e['Gen-B'].value) {
            alert('You Must complete the Checklist!');
            return false;
        }
        if(!e['Q2-A'].value) {
            alert('You Must complete the Checklist!');
            return false;
        }
        if(!e['invoice_number'].value) {
            alert('Invoice Number is REQUIRED!');
            return false;
        }
        return true;

    } else if(!e['reloaded'].value) {
        alert('You must indicate if you Reloaded the OS!');
        return false;
    }
}

在这个阶段,它只是返回“你必须指明你是否重新加载了操作系统!”即使它被选中了。

重点是从单选按钮选择中选择一个选项,然后它将显示一些复选框,并且必须先检查所有复选框,然后才能提交表单。显然,某些复选框仅显示是否选择了特定选项,因此需要将某些选项排除在必需之外。 还有一个需要填写的附加字段(invoice_number),它始终对其进行验证并始终有效。

收音机按钮:

<input name="reloaded" id="reloaded" type="radio" value="yes" onClick="Q1(this.value);" /> Yes</label> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <label><input name="reloaded" id="reloaded" type="radio" value="no" onClick="Q1(this.value);" />

除了ID /名称

之外,复选框都是相同的
<input name="Q1-A" id="Q1-A" type="checkbox" value="yes" />

必填文字框:

<input class="field size5" type="text" name="invoice_number" id="invoice_number" placeholder="Required! - 'RA' for Warranty Jobs" />

我确信由于我缺乏知识,我已经过度复杂了,但是我无法想到我出错的地方。

(通过onsubmit="return validate(this);"提交提交)

1 个答案:

答案 0 :(得分:0)

以下代码是我的最终结果,它有效;

                function validate(form) {
                var e = form.elements;

              if(document.getElementById('RL-Y').checked) {
                  if(!e['Q1-A'].checked || !e['Q1-B'].checked || !e['Q1-C'].checked || !e['Q1-D'].checked || !e['Q1-E'].checked || !e['Q1-G'].checked || !e['Gen-A'].checked || !e['Gen-B'].checked) {
                    alert('You Must complete the Checklist!');
                    return false;
                  }
                  if(!e['invoice_number'].value) {
                    alert('Invoice Number is REQUIRED!');
                    return false;
                  }
                  return true;

              } else if(document.getElementById('RL-N').checked) {
                  if(!e['Gen-A'].checked || !e['Gen-B'].checked || !e['Q2-A'].checked) {
                    alert('You Must complete the Checklist!');
                    return false;
                  }
                  if(!e['invoice_number'].value) {
                    alert('Invoice Number is REQUIRED!');
                    return false;
                  }
                  return true;

              } else {
                alert('You must indicate if you Reloaded the OS!');
                return false;
              }
            }