Hi,
Select and unselect all the Gridview records using Checkbox using Client side JQuery, here Select all option is Associated to select all the rows in Current page of the Gridview. Here I used Class name as a JQuery selector to select and deselect the records. Template field in Gridview is necessary to insert a Control inside the Gridview. Use HTML Control rather than ASP control to get the selected Checkbox value of the Gridview.
output preview :
ASP.NET CODE :
Select and unselect all the Gridview records using Checkbox using Client side JQuery, here Select all option is Associated to select all the rows in Current page of the Gridview. Here I used Class name as a JQuery selector to select and deselect the records. Template field in Gridview is necessary to insert a Control inside the Gridview. Use HTML Control rather than ASP control to get the selected Checkbox value of the Gridview.
output preview :
ASP.NET CODE :
<html>
<head runat="server">
<title>Copyright
@Fourthbottle</title>
<script src="Scripts/jquery-2.1.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
function
Selectallcheckbox(e) {
if
(e.checked) {
$(".checkboxselection").prop("checked", true)
}
else
{
$(".checkboxselection").prop("checked", false)
}
}
function
SelectallColorsForStyle(e, eval) {
if
(e.checked) {
if
(!$('input.checkboxselection[type=checkbox]:not(:checked)').length)
$("#CHK_STY_ALL").prop("checked", true);
}
else
{
$("#CHK_STY_ALL").attr("checked", false);
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<table width="100%">
<tr>
<td align="center">
<asp:GridView ID="grd" runat="server" AutoGenerateColumns="false">
<Columns>
<asp:TemplateField ItemStyle-HorizontalAlign="Center">
<HeaderTemplate>SELECT ALL<br />
<asp:CheckBox ID="CHK_STY_ALL"
runat="server"
ClientIDMode="Static"
onclick="javascript:Selectallcheckbox(this);"/>
</HeaderTemplate>
<ItemTemplate>
<input type="checkbox"
id="CHK_STY"
runat="server"
onchange="javascript:SelectallColorsForStyle(this,this.value);" class="checkboxselection"
value='<%#Eval("Brand")%>' />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField HeaderText="BRAND"
ItemStyle-Width="90px"
DataField="Brand"
/>
<asp:BoundField HeaderText="MODEL"
ItemStyle-Width="90px"
DataField="Model"
/>
<asp:BoundField HeaderText="TYPE"
ItemStyle-Width="90px"
DataField="Type"
/>
<asp:BoundField HeaderText="PRICE"
ItemStyle-Width="90px"
DataField="Price"
/>
</Columns>
</asp:GridView>
</td>
</tr>
</table>
<asp:Label ID="lblstatus" ClientIDMode="Static" runat="server"></asp:Label>
</div>
</form>
</body>
</html>
C# CODE:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using
System.Web.UI.WebControls;
using System.Data;
using
System.Data.SqlClient;
namespace GRD_Merge_Paging
{
public partial class GRD_selectall : System.Web.UI.Page
{
protected
void Page_Load(object
sender, EventArgs e)
{
SqlConnection
con = new SqlConnection("Connection string");
string
Query = "select top 12 * from Table1 order by
Brand desc";
SqlDataAdapter
da = new SqlDataAdapter(Query,
con);
DataSet
DS = new DataSet();
try
{
con.Open();
da.Fill(DS);
grd.DataSource = DS;
grd.DataBind();
con.Close();
}
catch
(Exception es)
{
lblstatus.Text =
es.Message.ToString();
}
}
}
}