How to select all checkbox inside a gridview datagrid in asp.net Javascript
Using below method, all the checkboxes will select/unsleect inside the gid. This will work as toggle. You have to add a checkbox inside the header tag, when you will click on this checkbox then all the checkbox inside the gid will select. You can use this method on datagrid, datalist, gridview, listbox etc.
Gridview code in ASPX page
<asp:GridView Width="100%" ID="gdvListing" runat="server" GridLines="none"
DataKeyNames="LID" AllowSorting="true" AutoGenerateColumns="False" AllowPaging="True"
EmptyDataText="No Record Found !!" OnPageIndexChanging="gdvListing_PageIndexChanging"
OnRowCreated="gdvListing_RowCreated" OnSorting="gdvListing_Sorting" CellSpacing="1"
CellPadding="2" BorderWidth="0" EmptyDataRowStyle-Font-Bold="true">
<HeaderStyle HorizontalAlign="center" CssClass="Grid_HeaderStyle" />
<RowStyle HorizontalAlign="left" CssClass="rowStyle" />
<AlternatingRowStyle HorizontalAlign="left" CssClass="AlternateStyle" />
<Columns>
<asp:TemplateField HeaderStyle-HorizontalAlign="left">
<HeaderTemplate>
<input type="checkbox" name="ChkAll" onclick="SelectAllCheckbox(this,'frmPage','ContentPlaceHolder1_gdvListing')" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkBox" runat="server" />
</ItemTemplate>
<ItemStyle HorizontalAlign="left" Width="1%" />
</asp:TemplateField>
</Columns>
</asp:GridView>
Javascript function to select all checkbox inside the grid
function SelectAllCheckbox(objChk, formName, gridName) {
var selectedBoxes = "";
formObj = document.forms[formName];
var SelectAllCheckbox = "";
if (formObj.elements[gridName]) {
SelectAllCheckbox = formObj.elements[gridName];
}
else if (document.getElementById(gridName)) {
returnval = document.getElementById(gridName);
}
if (SelectAllCheckbox.getElementsByTagName("input")) {
var inputTags = SelectAllCheckbox.getElementsByTagName("input");
var tagsLength = inputTags.length;
for (var i = 0; i < tagsLength; i++) {
if (objChk.checked == true) {
inputTags[i].checked = true;
}
else {
inputTags[i].checked = false;
}
}
}
return true;
}
Javascript function if you want to check that is record is selected or not in grid. If no record will be selected by checkbox then alert msg will popup.
function ConfirmationDelete(formName, gridName) {
var selectedBoxes = "";
formObj = document.forms[formName];
var retval = "";
if (formObj.elements[gridName]) {
retval = formObj.elements[gridName];
}
else if (document.getElementById(gridName)) {
retval = document.getElementById(gridName);
}
var inputTags = retval.getElementsByTagName("input");
var tagsLength = inputTags.length;
for (var i = 0; i < tagsLength; i++) {
if (inputTags[i].checked == true)
selectedBoxes = "1";
}
if (selectedBoxes.length > 0) {
return window.confirm("Are you sure you want to delete records?");
}
else {
alert("Please select the item(s) you want to delete!");
return false;
}
}
Related Alrticles