如何使用javascript在选中网格视图复选框时创建表行
How to create a table row on selecting a gridview checkbox using javascript
我使用的是一个带有复选框的网格视图,在选中网格视图中的任何复选框时,我需要用它创建一个表行。我需要帮助使用javascript获取网格视图的选定行。
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!!!");
}
我没有在网格视图上尝试过,但您可以通过使用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工具检查元素。
相关文章:
- 如何创建php函数或任何脚本/jquery Javascript,使我能够获取与复选框关联的值并添加它们
- 动态创建唯一的复选框
- 如何创建只允许用户在选中前一个复选框的情况下选择复选框的复选框验证
- 如何在 Angular JS 中从关联数组创建多个复选框
- 单击或取消选中复选框时,如何创建弹出的自定义窗口
- 基于所选下拉列表值创建动态复选框
- “动态创建的表”上的复选框(每行最多只能选择1个)
- 函数更改不适用于动态创建的表的复选框
- 如何创建一个新的<李>带有复选框或<a>在里面
- 在react中切换动态创建的复选框
- 在服务器上创建一个复选框,使用 javascript 处理函数
- jQuery .change() 方法不适用于动态创建的复选框
- 如何创建至少 1 个框处于活动状态的复选框列表
- 为选中的每个复选框创建隐藏输入
- 从复选框创建具有复杂变量的对象
- JavaScript 从表单元素处理复选框创建 URL
- 动态复选框创建以在单击时运行函数
- 如何使用输入复选框创建/更新数组
- Joomla-使用ajax从复选框创建会话变量
- 无法使用 jquery AJAX PHP 为复选框创建数组