vendredi 22 janvier 2021

Get cell values of checked row from GridView using javascript

<asp:GridView ID="GrdVw_subOffered" runat="server" AutoGenerateColumns="False" DataKeyNames="sub_id" DataSourceID="SqlDtSrc_subOffered" CssClass="table table-bordered table-hover" Width="80%">
    <Columns>
        <asp:TemplateField>
            <ItemTemplate>
                <asp:CheckBox ID="chkRow" runat="server" onclick="CheckOne(this)" />
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="sub_id" InsertVisible="False" SortExpression="sub_id" Visible="True">
            <ItemTemplate>
                <asp:Label ID="lbl_subid" runat="server" Text='<%# Bind("sub_id") %>'  ClientIDMode="Static"></asp:Label>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Group" SortExpression="subgroup">
            <EditItemTemplate>
                <asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("subgroup") %>'></asp:TextBox>
            </EditItemTemplate>
            <ItemTemplate>
                <asp:Label ID="Label1" runat="server" Text='<%#(Eval("subgroup").ToString().ToUpper()) %>' ClientIDMode="Static"></asp:Label>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:BoundField DataField="sub_combination" HeaderText="Subject Combination" SortExpression="sub_combination" />
    </Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlDtSrc_subOffered" runat="server" ConnectionString="<%$ ConnectionStrings:Test_Conn %>" SelectCommand="SELECT [sub_id], [subgroup], [sub_combination] FROM [Subject_tbl]"></asp:SqlDataSource>
<asp:Label runat="server" ID="lbl_group" ClientIDMode="Static" ></asp:Label>
<asp:Label runat="server" ID="lbl_sub" ClientIDMode="Static" ></asp:Label>

This is the GridView I have with checkbox that can select only one row, what I am trying to get is the values of selected row and populate them on labels by using JavaScript. Here's the script for selecting only one checkbox and I am trying to somehow get what I want from this existing function.

function CheckOne(obj) {
            var grid = obj.parentNode.parentNode.parentNode;
            var inputs = grid.getElementsByTagName("input");
            for (var i = 0; i < inputs.length; i++) {
                if (inputs[i].type == "checkbox") {
                    if (obj.checked && inputs[i] != obj && inputs[i].checked) {
                        inputs[i].checked = false;
                        var row = $(this).closest("tr")[0];
                        var id = row.cells[1].innerHTML;
                        var group = row.cells[2].innerHTML;
                        var sub = row.cells[3].innerHTML;
                        $('#lbl_group').val(group.trim());
                        $('#lbl_sub').val(sub.trim());
                    }
                }
            }
        }

I am really new to JavaScript, not sure what I am doing wrong here, please help :[]. Thanks :)




Aucun commentaire:

Enregistrer un commentaire