Applying Single Selection to the CheckBox in a GridView using ASP.NET

Suppose you have a CheckBox in the GridView as a TemplateField and you want two make it single checkable. This will help you to do the same. Using this you will be able to select only one CheckBox at a time.

Step 1: Put  the following  java script code  in the head section of the webpage.

<script type="text/javascript">   
         function CheckSingleCheckbox(ob)
    {
        var grid = ob.parentNode.parentNode.parentNode;
        var inputs = grid.getElementsByTagName("input");
        for(var i=0;i<inputs.length;i++)
        {
            if (inputs[i].type =="checkbox")
            {
                if(ob.checked && inputs[i] != ob && inputs[i].checked)
                {
                    inputs[i].checked = false;
                }
            }
        }
    }
    </script>

Step 2: Here I have taken a checkbox as  a TemplateField of the GridView and just call the above javascript function to make it single checkable.

<asp:GridView ID="GridView1" GridLines="Both"
        runat="server" Width="100%" CellPadding="4"
        Font-Size="Smaller" AutoGenerateColumns="False"
        ForeColor="Blue" onrowdatabound="GridView1_RowDataBound"> 
      <Columns>
      <asp:TemplateField>
       <ItemTemplate>
           <asp:CheckBox ID="CheckBox1" runat="server" OnCheckedChanged="CheckBox1_CheckedChanged"Visible="true"
          OnDataBinding="CheckBox1_DataBinding"
onclick ="CheckSingleCheckbox(this)" />
     </ItemTemplate>
     </asp:TemplateField>
      <asp:BoundField  DataField="CHANNEL" HeaderText="Channel No"/>
      <asp:BoundField  DataField="STATUS" HeaderText="Status"/>
      <asp:BoundField  DataField="DIALING_NUMBER" HeaderText="Dialing No"/>
      <asp:BoundField  DataField="NAME" HeaderText="Name"/>
      <asp:BoundField  DataField="COMPANY_NAME" HeaderText="Company Name"/>
      <asp:BoundField  DataField="CONNECT_TIME" HeaderText="Connect Time"/>
      <asp:BoundField  DataField="DURATION" HeaderText="Duration"/>
      </Columns>
    <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
      <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
      <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
      <HeaderStyle BackColor="#00AAFF" Font-Bold="True" ForeColor="White" />
      <EditRowStyle BackColor="#999999" />
    </asp:GridView>

Ebook Download
View all
Learn
View all