Monday, August 10, 2009

To Select All Checkboxes in Grid View Using JavaScript

In this I have given simple tip to select all the check boxes in the template field of a gridview
Using JavaScript,

Place the JavaScript where the gridview you have to bind

JavaScript in the Page

<script type="text/javascript" language="javascript">
function fncheckAll()
{
var eleChk=event.srcElement;
var eleTbody=eleChk.parentNode.parentNode.parentNode;
var i=1;
for(i=1;i<eleTbody.children.length;i++)
eleTbody.children[i].children[2].children[0].checked=eleChk.checked;
}
</script>


Grid View

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" >
<Columns>
<asp:BoundField DataField="CustomerName" HeaderText="Name" />
<asp:BoundField DataField="CustomerAge" HeaderText="Age" />
<asp:TemplateField>
<HeaderTemplate>
<asp:CheckBox ID="chkSelectAll" runat="server" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkId" runat="server" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>


Code Behind

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
CType(e.Row.Cells(2).FindControl("chkSelectAll"), CheckBox).Attributes.Add("onclick", "fncheckAll()")
End If
End Sub

Close Project Coordination -We know who to blame.

No comments:

Post a Comment