C# Corner
Tech
News
Videos
Forums
Jobs
Books
Events
More
Interviews
Live
Learn
Training
Career
Members
Blogs
Challenges
Certification
Contribute
Article
Blog
Video
Ebook
Interview Question
Collapse
Feed
Dashboard
Wallet
Learn
Achievements
Network
Refer
Rewards
SharpGPT
Premium
Contribute
Article
Blog
Video
Ebook
Interview Question
Register
Login
Add a Checkbox in ASP GridView with the Select All Functionality
WhatsApp
Hiren Bhatti
5y
16.6
k
0
1
25
Blog
Introduction
This code will show you how to add a checkbox in ASP Gridview with the select all functionality. It also shows how to get selected checkbox Gridview row values. I have added only two columns in Gridview, but you can use the code as per your requirement.
Code
.aspx page code
Add a Javascript reference to your page:
<script type=
"text/javascript"
src=
"jquery.js"
></script>
<script type=
"text/javascript"
>
$(document).ready(function () {
var headerChk = $(
".chkHeader input"
);
var itemChk = $(
".chkItem input"
);
headerChk.click(function () {
itemChk.each(function () {
this
.
checked
= headerChk[0].
checked
;
})
});
itemChk.each(function () {
$(
this
).click(function () {
if
(
this
.
checked
==
false
)
{
headerChk[0].
checked
=
false
;
}
})
});
});
</script>
<asp:GridView ID=
"gvdashboard"
ClientIDMode=
"Static"
runat=
"server"
class
=
"table table-striped"
AutoGenerateColumns=
"False"
GridLines=
"None"
CellPadding=
"4"
ForeColor=
"#333333"
>
<AlternatingRowStyle BackColor=
"White"
/>
<Columns>
<asp:TemplateField ItemStyle-Width=
"10px"
HeaderStyle-Width=
"10px"
>
<HeaderTemplate>
<asp:CheckBox ID=
"chkSelectAll"
CssClass=
"chkHeader"
runat=
"server"
/>
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID=
"chkRow"
CssClass=
"chkItem"
runat=
"server"
/>
</ItemTemplate>
<HeaderStyle Width=
"10px"
></HeaderStyle>
<ItemStyle Width=
"10px"
></ItemStyle>
</asp:TemplateField>
<asp:BoundField DataField=
"ID"
HeaderText=
"ID"
></asp:BoundField>
<asp:BoundField DataField=
"Name"
HeaderText=
"Name"
></asp:BoundField>
</Columns>
<EditRowStyle BackColor=
"#2461BF"
/>
<FooterStyle BackColor=
"#507CD1"
ForeColor=
"White"
Font-Bold=
"True"
/>
<HeaderStyle BackColor=
"#507CD1"
Font-Bold=
"True"
ForeColor=
"White"
/>
<PagerStyle CssClass=
"pagination"
BackColor=
"#2461BF"
ForeColor=
"White"
HorizontalAlign=
"Center"
/>
<RowStyle BackColor=
"#EFF3FB"
/>
<SelectedRowStyle BackColor=
"#D1DDF1"
Font-Bold=
"True"
ForeColor=
"#333333"
/>
<SortedAscendingCellStyle BackColor=
"#F5F7FB"
/>
<SortedAscendingHeaderStyle BackColor=
"#6D95E1"
/>
<SortedDescendingCellStyle BackColor=
"#E9EBEF"
/>
<SortedDescendingHeaderStyle BackColor=
"#4870BE"
/>
</asp:GridView>
.aspx.cs page code
foreach
(GridViewRow row
in
gvdashboard.Rows)
{
if
(row.RowType == DataControlRowType.DataRow)
{
CheckBox chkRow = (row.Cells[0].FindControl(
"chkRow"
)
as
CheckBox);
if
(chkRow.Checked)
{
// do whatever your logic
}
}
}
Add checkbox in gridview
C#
jQuery
Javascript
People also reading
Membership not found