CheckBoxList Validation in ASP.NET

CheckBoxList Validation in ASP.NET

by Jaganathan

HTML

<table id="chkDemo">
    <tbody>
        <tr>
            <td>
                <input type="checkbox" value="1" name="chkDemo$0" id="chkDemo_0">
                <label for="chkDemo_0">Apples</label>
            </td>
            <td>
                <input type="checkbox" value="2" name="chkDemo$1" id="chkDemo_1">
                <label for="chkDemo_1">Oranges</label>
            </td>
            <td>
                <input type="checkbox" value="3" name="chkDemo$2" id="chkDemo_2">
                <label for="chkDemo_2">Mangoes</label>
            </td>
        </tr>
    </tbody>
</table>
<input type="submit" id="Button1" onclick="return validateCheckBoxList();" value="Submit" name="Button1">

JavaScript

function validateCheckBoxList() {
    var isAnyCheckBoxChecked = false;

    // ::: Step-1 & 2 ::: Let's get all the CheckBoxes inside the CheckBoxList.
    var checkBoxes = document.getElementById("chkDemo").getElementsByTagName("input");

    // ::: NOTE ::: For jsfiddle demo I have directly used the ID.
    // Otherwise you might have to use ClientID like below...
    // document.getElementById("<%= chkDemo.ClientID %>").getElementsByTagName("input");

    // ::: Step-3 ::: Now let's Loop through the Children.
    for (var i = 0; i < checkBoxes.length; i++) {
        if (checkBoxes[i].type == "checkbox") {
            if (checkBoxes[i].checked) {
                // ::: Step-4 ::: If current CheckBox is checked, then show alert.
                // Break the Loop.
                isAnyCheckBoxChecked = true;
                alert("Atleast one CheckBox is checked");
                break;
            }
        }
    }

    // ::: Step-5 ::: Check if any CheckBox is checked or not.
    // Show alert and return accordingly.
    if (!isAnyCheckBoxChecked) {
        alert("No CheckBox is Checked.");
    }

    return isAnyCheckBoxChecked;
}