Faraz Shah Khan : Checkbox

Mutually exclusive checkbox in GridView using Javascript

farazsk11 — Sat, 02 Aug 2008 11:00:00 GMT

I response to one of my blog post entry I received few queries regarding mutually exclusive checkbox within GirdView, meaning if there are two checkboxes in a row only one can be selected at a time. If checkbox1 is selected and you select checkbox2 then checkbox1 should be deselected. Following javascript and html can be used.

Code Behind:

----------------------------------.vb file if VB.Net is the language ------------------------------------

Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound
        If (e.Row.RowType = DataControlRowType.DataRow) Then
            DirectCast(e.Row.FindControl("cbStatus1"), CheckBox).Attributes.Add("onclick", "javascript:checkMutuallyExclusive('" & DirectCast(e.Row.FindControl("cbStatus2"), CheckBox).ClientID & "')")
            DirectCast(e.Row.FindControl("cbStatus2"), CheckBox).Attributes.Add("onclick", "javascript:checkMutuallyExclusive('" & DirectCast(e.Row.FindControl("cbStatus1"), CheckBox).ClientID & "')")
        End If
End Sub

----------------------------------.cs file if C#.Net is the language ------------------------------------

protected void GridView1_RowDataBound(object sender, System.Web.UI.WebControls.GridViewRowEventArgs e)
{
    if ((e.Row.RowType == DataControlRowType.DataRow)) {
        ((CheckBox)e.Row.FindControl("cbStatus1")).Attributes.Add("onclick", "javascript:checkMutuallyExclusive('" + ((CheckBox)e.Row.FindControl("cbStatus2")).ClientID + "')");
        ((CheckBox)e.Row.FindControl("cbStatus2")).Attributes.Add("onclick", "javascript:checkMutuallyExclusive('" + ((CheckBox)e.Row.FindControl("cbStatus1")).ClientID + "')");
    }
}

Javascript Enable/Disable Dropdown in Gridview using Checkboxes

farazsk11 — Wed, 27 Feb 2008 06:59:00 GMT

If you come up with some requirement in which you have a Checkbox and a DropDownList in GridView control and you are requried to enable disable the DropDownList on the basis of the CheckBox value you can use following Code.

-----------------------------------.aspx file ----------------------------------

----------------------------------.vb file if VB.Net is the language ------------------------------------

----------------------------------.cs file if C#.Net is the language ------------------------------------

Check/Uncheck checkboxes in GridView using javascript

farazsk11 — Wed, 13 Feb 2008 09:58:00 GMT

Seen a lot of questions regarding how to check/uncheck CheckBoxes within a GridView control using JavaScript. So I thought to put it on my blog for quick reference for others and for myself. Following is the code:
------------------------------------------- .aspx code ---------------------------------------------
<script type="text/javascript">
function SelectAll(id)
      {
      var frm = document.forms[0];

            for (i=0;i<frm.elements.length;i++)
            {
                if (frm.elements[i].type == "checkbox")
                {
          frm.elements[i].checked = document.getElementById(id).checked;
                }
            }
        }

</script>
<asp:GridView ID="GridView1" runat="server" DataSourceID="SqlDataSource1" Width="400px">
        <Columns>
            <asp:TemplateField>
                <AlternatingItemTemplate>
                    <asp:CheckBox ID="CheckBox1" runat="server" />
                </AlternatingItemTemplate>
                <ItemTemplate>
                    <asp:CheckBox ID="CheckBox1" runat="server" />
                </ItemTemplate>
                <HeaderTemplate>
                    <asp:CheckBox ID="cbSelectAll" runat="server" Text="Select All" />
                </HeaderTemplate>
                <HeaderStyle HorizontalAlign="Left" />
                <ItemStyle HorizontalAlign="Left" />
            </asp:TemplateField>
        </Columns>
    </asp:GridView>

----------------------------------------- .vb file if VB.Net is the language ------------------------------------------
VB.Net Code
Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound
        If (e.Row.RowType = DataControlRowType.Header) Then
            'adding an attribut for onclick event on the check box in the hearder and passing the ClientID of the Select All checkbox
            DirectCast(e.Row.FindControl("cbSelectAll"), CheckBox).Attributes.Add("onclick", "javascript:SelectAll('" & DirectCast(e.Row.FindControl("cbSelectAll"), CheckBox).ClientID & "')")
        End If
    End Sub

----------------------------------------- .cs file if C#.Net is the language ------------------------------------------
C#.Net Code

protected void GridView1_RowDataBound(object sender, System.Web.UI.WebControls.GridViewRowEventArgs e)
    {
        if ((e.Row.RowType == DataControlRowType.Header))
        {
            //adding an attribut for onclick event on the check box in the hearder and passing the ClientID of the Select All checkbox
            ((CheckBox)e.Row.FindControl("cbSelectAll")).Attributes.Add("onclick", "javascript:SelectAll('" + ((CheckBox)e.Row.FindControl("cbSelectAll")).ClientID + "')");
        }
    }