Hi I am trying to use this checkAll function.
If I click on the checkAll checkbox, then all of the row will be selected and the background color will change accordingly.
Here is my javascript:
function checkAll(objRef) {
var GridView = objRef.parentNode.parentNode.parentNode;
var inputList = GridView.getElementsByTagName("input");
for (var i = 0; i < inputList.length; i++) {
var row = inputList[i].parentNode.parentNode;
if (inputList[i].type == "checkbox" && objRef != inputList[i]) {
if (objRef.checked) {
row.style.backgroundColor = "aqua";
inputList[i].checked = true;
}
else {
if (row.rowIndex % 2 == 0) {
row.style.backgroundColor = "#e4edfb";
} else {
row.style.backgroundColor = "white";
}
inputList[i].checked = false;
}
}
}
}
This is my code:
<asp:TemplateField>
<HeaderTemplate>
<asp:CheckBox ID="checkAll" runat="server" onclick="checkAll(this);" />
</HeaderTemplate>
<ItemStyle HorizontalAlign="Center" />
<ItemTemplate>
<asp:HiddenField ID="hidID" runat="server" Value='<%# Eval("Id") %>' />
<asp:CheckBox runat="server" ID="chkBoxMultipleSelect" CssClass="chkBoxMultipleSelect" OnClick="checkIfUnselected(this);" />
</ItemTemplate>
</asp:TemplateField>
After click on the checkAll checkBox, I am only able to change the color of that checkbox column only, but not my other column.
Any help is apparated. Thanks.
function checkAll(spanChk) {
var IsChecked = spanChk.checked;
var Chk = spanChk;
Parent = document.getElementById('gvMessageReportShow');
var items = Parent.getElementsByTagName('input');
for (i = 0; i < items.length; i++) {
if (items[i].id != Chk && items[i].type == "checkbox") {
if (items[i].checked != IsChecked) {
spanChk.parentElement.parentElement.style.backgroundColor = 'aqua';
items[i].click();
}
}
}
}
I ended up finding my answer here