jeudi 7 mars 2019

How to uncheck a checkbox if another checkbox is checked within the same row

If DeviceOne checkbox is checked in column labeled On and a user decides to check checkbox off. How would I be able to uncheck the checkbox from On automatically so that the only checkbox present is Off. Only one checkbox should be present at a time. User should not have the ability to have 2 checkbox checked within the same row. Thanks in advance.

                                        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False">
            <Columns>
                <asp:BoundField DataField="deviceName" HeaderText="Device Name" />
                <asp:BoundField DataField="Status" HeaderText="Status" />
                <asp:TemplateField>
                    <HeaderTemplate>
                        <asp:Label ID="lblOn" runat="server" Text="On"></asp:Label>
                    </HeaderTemplate>
                    <ItemTemplate>
                        <asp:CheckBox ID="checkboxOn" onclick="checkboxOnClick(this);" AutoPostBack="false" runat="server" />
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField>
                    <HeaderTemplate>
                        <asp:Label ID="lblOff" runat="server" Text="OFF"></asp:Label>
                    </HeaderTemplate>
                    <ItemTemplate>
                        <asp:CheckBox ID="checkboxOff" onclick="checkboxOffClick(this);" AutoPostBack="false" runat="server" />
                    </ItemTemplate>
                </asp:TemplateField>


            </Columns>
        </asp:GridView>
        <script type="text/javascript">
            function checkboxOnClick(checkbox) {
                var gridView = document.getElementById("GridView1");
                var atleastOneCheckboxUnchecked = false;
                for (i = 1; i < gridView.rows.length; i++) {
                    if (gridView.rows[i].cells[3].getElementsByTagName("INPUT")[0].checked == false) {
                        atleastOneCheckboxUnchecked = true;
                        break;
                    }
                }
                gridView.rows[0].cells[3].getElementsByTagName("INPUT")[0].checked = !atleastOneCheckboxUnchecked;

            }
            function checkboxOffClick(checkbox) {
                var gridView = document.getElementById("GridView1");
                var atleastOneCheckboxUnchecked = false;
                for (i = 1; i < gridView.rows.length; i++) {
                    if (gridView.rows[i].cells[4].getElementsByTagName("INPUT")[0].checked == false) {
                        atleastOneCheckboxUnchecked = true;
                        break;
                    }
                }
                gridView.rows[0].cells[4].getElementsByTagName("INPUT")[0].checked = !atleastOneCheckboxUnchecked;
            }

        </script>




Aucun commentaire:

Enregistrer un commentaire