In this article I will explain with an example, how to make CheckBoxList mutually exclusive i.e. make it work similar to RadioButtonList where user can select only one item (option) from the list of items (options) and at the same time it is possible to uncheck all CheckBoxes in CheckBoxList which is not possible in the case of RadioButtonList.
The ASP.Net RadioButtons and RadioButtonList controls provide mutual exclusion i.e. one can select only one out of N items if another item is selected the previous one gets unchecked.
Problem with RadioButtons and RadioButtonList controls is that once a check is made in the group of RadioButtons then it cannot be unchecked i.e. it is not possible to return to the state when all were unchecked.
Thus when ASP.Net CheckBox or CheckBoxList controls are made mutually exclusive using JavaScript the following functions are possible.
1. User can select only one item (option).
2. User can also uncheck his selection and leave all CheckBoxes blank.
 
 
Mutually Exclusive CheckBox JavaScript function
The following JavaScript function accepts CheckBox that was clicked as reference. Using the reference of the CheckBox, its parent Table is determined and all the CheckBoxes present in the Table are fetched.
Then a loop is executed over all CheckBoxes inside the CheckBoxList and all the other CheckBoxes are unchecked.
<script type="text/javascript">
    function MutExChkList(chk) {
        var chkList = chk.parentNode.parentNode.parentNode;
        var chks = chkList.getElementsByTagName("input");
        for (var i = 0; i < chks.length; i++) {
            if (chks[i] != chk && chk.checked) {
                chks[i].checked = false;
            }
        }
    }
</script>
 
 
Calling the JavaScript function when CheckBoxList's CheckBoxes are clicked
There are two ways to call the JavaScript function when the CheckBox is clicked.
1. Direct Method
The easiest way to set JavaScript OnClick event handler to the CheckBoxList’s ListItem as shown below. Though this method works, but it will generate Visual Studio warnings, which could be annoying to some users and hence if you don’t like this method, you can use the 2nd method.
<asp:CheckBoxList ID="CheckBoxList1" runat="server">
    <asp:ListItem Text="Mango" Value="1" onclick="MutExChkList(this);" />
    <asp:ListItem Text="Apple" Value="2" onclick="MutExChkList(this);" />
    <asp:ListItem Text="Banana" Value="3" onclick="MutExChkList(this);" />
    <asp:ListItem Text="Guava" Value="4" onclick="MutExChkList(this);" />
    <asp:ListItem Text="Orange" Value="5" onclick="MutExChkList(this);" />
</asp:CheckBoxList>
 
2. Code Behind Method
In this method, the JavaScript OnClick event handler is assigned from code behind. A loop is executed over the CheckBoxList items and the JavaScript OnClick event handler is set.
<asp:CheckBoxList ID="CheckBoxList1" runat="server">
    <asp:ListItem Text="Mango" Value="1" />
    <asp:ListItem Text="Apple" Value="2" />
    <asp:ListItem Text="Banana" Value="3" />
    <asp:ListItem Text="Guava" Value="4" />
    <asp:ListItem Text="Orange" Value="5" />
</asp:CheckBoxList>
 
C#
protected void Page_Load(object sender, EventArgs e)
{
    for (int i = 0; i < CheckBoxList1.Items.Count; i++)
    {
        CheckBoxList1.Items[i].Attributes.Add("onclick", "MutExChkList(this)");
    }
}
 
VB.Net
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
    For i As Integer = 0 To CheckBoxList1.Items.Count - 1
        CheckBoxList1.Items(i).Attributes.Add("onclick", "MutExChkList(this)")
    Next
End Sub
 
 
Screenshot
Mutually Exclusive CheckBoxList Control in ASP.Net
 
 
Browser Compatibility

The above code has been tested in the following browsers.

Internet Explorer  FireFox  Chrome  Safari  Opera 

* All browser logos displayed above are property of their respective owners.

 
 
Demo
 
 
Downloads