0

I have tried so many options, but nothing has worked.

The main problem is that I have so many check boxes all are generated through php loop, so they have same name and id. I want to check that on submit of that form that at least one should be checked. I have tried so many function so not sure which should be pasted here. So it is better that some one suggest me some fresh answer.

function Validate_Checkbox()
{
    var chks=document.getElementsByTagName('input');   
    var hasChecked = false;
    for (var i = 0; i < chks.length; i++)
    {
        if (chks[i].checked)
        {
            hasChecked = true;
            break;
        }
    }
    if (hasChecked == false)
    {
        alert("Please select at least one checkbox..!");

        return false;
    }

    return true;
}

It is called as onsubmit="return Validate_Checkbox()" in form tag.

Basically I am looking for a JavaScript function.

4

4 回答 4

2

好吧，您的代码可以满足您描述的目的。它可能更短，但没有明显的问题。

缩短版

function validate_checkbox() {
    var cbs = document.getElementsByTagName('input');
    for (var i=0, len = cbs.length; i < len; i++)
        if (cbs[i].type.toLowerCase() == 'checkbox' && cbs[i].checked)
            return true;
    alert("Please check at least one checkbox");
    return false;
}

更短的版本（如果你不关心旧的 IE）

function validate_checkbox() {
    var checked = document.querySelectorAll('input[type=checkbox]:checked').length;
    if (!checked) alert("Please select at least one checkbox");
    return !!checked;
}

笔记：

1) ID 必须是唯一的 - 您不能在多个元素中重复 ID

2) 在 JavaScript 中，最好将左花括号放在同一行，而不是下一个

3) 避免大写函数，除非你打算实例化它们

于 2012-08-24T09:36:39.250 回答
0

如果您有其他类型的输入（如text或submit按钮），您的代码将失败。首先，您必须检查这是否是复选框。

if (chks[i].type=="checkbox" && chks[i].checked)

或者如果你使用 jQuery，事情会更容易

if ($('input:checked').length < 1){
  //Nothing checked
}
于 2012-08-24T09:37:44.123 回答
0

为什么只在提交时检查它？我使用 Mootools 编写了一个函数，该函数在每个复选框上调用 onchange，并检查同一 div 中的每个复选框。如果没有选中其他复选框，则用户不能取消选中最后一个选中的复选框。

<input type='checkbox' onChange='validateCheckboxes(this)' name='name' value='val' >

 function validateCheckboxes(elem){
                    var checked = elem.checked;
                    elem.getParent().getElements("input[type=checkbox]").each(function(e){checked += e.checked});
                    if(checked == 0){
                        elem.checked = 1;
                    }
                }
于 2013-02-26T23:06:05.760 回答
0

功能似乎很好。你确定它会被调用吗？尝试使用 firefox "Firebug" 对其进行调试。打开 firebug->script 然后在这个函数上设置断点。

于 2012-08-24T09:38:54.300 回答