Wednesday, 13 October 2021

JavaScript CheckBox Change Color Not Working

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.



from JavaScript CheckBox Change Color Not Working

No comments:

Post a Comment