验证复选框和输入

时间:2013-04-28 04:31:59

标签: javascript forms checkbox validation

我有一个包含多个文本输入和复选框的表单(复选框来自数据库),所以...我知道如何验证它们,但我需要一起验证它们,我只是这样做的方式验证复选框,我知道它为什么会发生,但我不知道如何写出正确的方式...¿你能帮助我吗?这是代码:

<form action="sendreq.php" name="contact" onsubmit="return valida_frm(this)" method="post">
                <label>Name</label>
                <input name="name" type="text" />

                <label>Email</label>
                <input name="email" type="text"/><!-- And Severeal inputs then the checkboxes-->

<?php $list3 = mysql_query("SELECT * FROM products ORDER BY id ASC LIMIT 20"); 
                    while($row = mysql_fetch_object($list3)){ ?>


                <input id="product" name="product[]" class="label" type="checkbox" value="<?php echo $row->name?>"><label class="label"><?php echo $row->name?></label>                    

                <?php }?>

验证不能很好地解决原因,我只需要正确的方法来编写和统一警报的返回:

function valida_frm(form){
var alerta="Ooops:\n";
if (form.name.value == "") {alerta+="Name.\n";} 
if (form.email.value == "") {alerta+="Email.\n";}

for(var i = 0; i < form.product.length; i++){ 
    if(form.product[i].checked)return true;} 
    alert('Oooops'); 
    return false;   

if (alerta!="Error:\n"){
    alert(alerta);  
    return false;
}else{
    return true;
}   
}

谢谢你的时间!

1 个答案:

答案 0 :(得分:1)

不要为“name”调用字段,然后测试form.name,因为它已经有.name

然后测试表单[“product []”]而不是form.product - 你不能拥有id =“product”,因为ID必须是唯一的! 我建议你给id="product<?echo $somecounter; ?>" />...<label for="product<? echo $somecounter; ?>">...</label>

还要测试错误(或者我的建议中没有任何内容)而不是Oops

还修复了更多问题

DEMO

function valida_frm(form){
  var alerta="";
  if (form.name.value == "") {alerta+="Name.\n";}  // Please use FullName or such
  if (form.email.value == "") {alerta+="Email.\n";}
  var chks = form["product[]"],
      checked = false;
  for(var i = 0; i < chks.length; i++) { 
    if(chks[i].checked) {
      checked = true;
      break;
    }
  } 
  if (!checked) {
    alerta+='Product.\n'; 
  }  
  if (alerta){
    alert("Error:\n"+alerta);  
    return false;
  }
  return true;
}