如何确保至少选中一个复选框?

时间:2009-05-08 07:49:54

标签: javascript

我正在使用其值来自数据库的复选框。它的名字是一样的,但名字就像:

<input type="checkbox" id="chkBankServices" name="<%=bs.getServiceID()%>">
<%=bs.getServiceDesc()%>

通过这个我从数据库中获取值。 现在我必须验证应该至少选择一个复选框..

如果有人能帮助我,我将感谢你。 如果我这样给javascript代码:

var services = document.getElementsById( 'chkBankServices' );
if(!(services[0].checked) && 
   !(services[1].checked) && 
   !(services[2].checked) && 
   !(services[3].checked) && 
   !(services[4].checked) && 
   !(services[5].checked) && 
   !(services[6].checked) &&
   !(services[7].checked) && 
   !(services[8].checked))
{ 
    alert( "Please select at least one service to submit." );
    return false;
}

它没有发出任何警告信息。 这有什么不对的。 Plz帮帮我...... 提前致谢

6 个答案:

答案 0 :(得分:8)

在jQuery中:

   alert(  $("#chkBankServices input[type=checkbox]:checked").length > 0 );

答案 1 :(得分:5)

试试这个:

var services = document.getElementById( 'chkBankServices' );
var checkboxes = services.getElementsByTagName('input');
var checked = false;
for (var i=0,i0=checkboxes.length;i<i0;i++)
if (checkboxes[i].type.toLowerCase()=="checkbox")
{
    if (checkboxes[i].checked) checked = true;
}

然后:

if (!checked)
{
    alert('Not checked');
    return false;
}

答案 2 :(得分:4)

没有getElementsById方法,因为只应该有一个具有给定id的元素。也许你打算用getElementsByName?这允许返回多个元素。

由于这确实是客户端问题,如果您可以发布生成的HTML示例,我们可以为您提供更多指导。

答案 3 :(得分:0)

您是否检查过渲染的来源以确保您的复选框被赋予预期的名称?

答案 4 :(得分:0)

我不知道这是否可以帮助您解决您的具体问题,但如果您避免使用大量if块并使用循环代码,则代码会更容易阅读:

var checked = false;
for(var i=0;i<services.length;i++){
  if(services[i].checked){
    checked = true;
  }
}
if(!checked){
    alert( "Please select at least one service to submit." );
    return false;
}

答案 5 :(得分:0)

查看你的代码,我打赌你在某种转发器中有那个复选框,并且正在创建多个具有相同ID的复选框,这是无效的html。我会将它包装在div / span或具有如下ID的内容中:

 if (!isSomethingChecked()) {
    alert( "Please select at least one service to submit." );
    return false;
 }

  function isSomethingChecked() {
    var parent = document.getElementById("chkBankServices");
    for (var child in parent.childNodes) {
        var node = parent.childNodes[child];
        if (node && node.tagName === "INPUT" && node.checked) {
            return true;
        }
    }
    return false;
 }

我认为HTML看起来像:

<div id="chkBankServices">
    <input type="checkbox" id="Checkbox1" />
    <input type="checkbox" id="Checkbox2" checked="checked"/>
    <input type="checkbox" id="Checkbox3" checked="checked"/>
    <input type="checkbox" id="Checkbox4" />
    <input type="checkbox" id="Checkbox5" />
    <input type="checkbox" id="Checkbox6" />
    <input type="checkbox" id="Checkbox7" />
</div>