如何使用javascript在选择gridview复选框时创建表格行答案

【问题标题】：How to create a table row on selecting a gridview checkbox using javascript如何使用javascript在选择gridview复选框时创建表格行
【发布时间】：2012-07-11 05:16:22
【问题描述】：

我正在使用带有复选框的gridview，并且在检查gridview 中的任何复选框时，我需要从中创建一个表格行。我需要帮助才能使用 javascript 获取 gridview 的选定行。

GridView 源码

<asp:GridView ID="GrdCustomer" runat="server" BorderColor="#999999" CellPadding="3"
        ForeColor="Black" GridLines="Vertical" Width="640px" AllowPaging="True" AutoGenerateColumns="False"
        OnRowDataBound="GrdCustomer_RowDataBound">
        <Columns>
            <asp:TemplateField HeaderText="Select" ItemStyle-Width="50px">
                <ItemTemplate>
                    <input id="selector" onclick="javascript:bindToList(this);selectCustomers();" runat="server" type="checkbox" />
                </ItemTemplate>
                <HeaderTemplate>
                    <input id="selector" onclick="javascript:SelectDeselectAllCheckboxes(this);selectCustomers(); " runat="server"
                        type="checkbox" />
                </HeaderTemplate>
                <ItemStyle Width="50px" HorizontalAlign="Center"></ItemStyle>
            </asp:TemplateField>
            <asp:BoundField DataField="Salutation" HeaderText="Salutation">
                <ItemStyle HorizontalAlign="Center" />
            </asp:BoundField>
            <asp:BoundField DataField="Name" HeaderText="Client Name">
                <ItemStyle HorizontalAlign="Center" />
            </asp:BoundField>
            <asp:BoundField DataField="Address" HeaderText="Address" SortExpression="Email">
                <ItemStyle HorizontalAlign="Center" />
            </asp:BoundField>
            <asp:BoundField DataField="Title" HeaderText="Title">
                <ItemStyle HorizontalAlign="Center" />
            </asp:BoundField>
            <asp:BoundField DataField="Id" HeaderText="Id" />
        </Columns>
        <FooterStyle BackColor="#CCCCCC" />
        <PagerStyle BackColor="#999999" ForeColor="Black" />
        <SelectedRowStyle BackColor="#000099" Font-Bold="True" ForeColor="White" />
        <HeaderStyle BackColor="Black" Font-Bold="True" ForeColor="White" />
        <AlternatingRowStyle BackColor="#CCCCCC" />
    </asp:GridView>

在复选框检查状态下调用基本脚本（仅启动）

 function selectCustomers() {
        alert("Hey I'm over here!!!");
    }

【问题讨论】：

标签： c# javascript jquery asp.net

【解决方案1】：

我没有在 gridview 上尝试过，但是您可以通过使用 JS 中元素的 parentNode 属性来选择“tr”元素。 'tr' 可能是您选择的行。

例如。

点击复选框使用以下代码，

onclick="javascript:selectCustomers(this);"

然后在函数中，

function selectCustomers(chkbox) {
       var desiredparentelement = chkbox.parentNode.parentNode; // Use parent property to get tr
    }

检查您的 html 元素以了解复选框有多少父项。使用 Mozilla 或 Chrome 工具检查元素。

【讨论】：

谢谢...这是'parentElement'