我有一个列数很少的网格
<div id="AbstractDiv" runat="server" class="DivGrid">
<asp:GridView GridLines="None" ID="Abstract_GridView" runat="server" AutoGenerateColumns="False" CssClass="Grid" CellPadding="0">
<Columns>
<asp:TemplateField HeaderText="Select">
<HeaderTemplate>
<asp:CheckBox ID="AllChk" runat="server" TabIndex="3" CssClass="smallCheckbox"/>
</HeaderTemplate>
<ItemStyle HorizontalAlign="Center" />
<ItemTemplate>
<asp:CheckBox ID="SelectChk" runat="server" TabIndex="5" CssClass="smallCheckbox" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:HiddenField ID="EqpNo" runat="server" value='<%# Bind("Equipmnt_No") %>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
我在一起检查几个复选框时遇到问题。我有一个EqpNo列,所有EqpNo与所选行匹配的行应检查行复选框。
我提到url,但它只允许检查一行。下面是我的Jquery代码,它检查所有行而不是仅匹配一行。
$('#<%=Abstract_GridView.ClientID %>').delegate('tr', 'click', function () {
var SelectRowEqpNo = $(this).find("input[id*=EqpNo]").attr("value"); //trying to get the clicked row EqpNo
$('#<%=Abstract_GridView.ClientID %> tr input[id*="EqpNo"]').each(function () {
var Eachrw = $(this).val(); //getting each row EqpNo
if (SelectRowEqpNo == Eachrw) { //Comparing both values if matching
$('#<%=Abstract_GridView.ClientID %> tr input[id*="SelectChk"]:checkbox').attr('checked', true);
}
});
});
答案 0 :(得分:0)
尝试:
$('#<%=Abstract_GridView.ClientID %>').on('click', 'tr', function () {
var SelectRowEqpNo = $(this).find("input[id*=EqpNo]").val(); //trying to get the clicked row EqpNo
$('#<%=Abstract_GridView.ClientID %> tr input[id*="EqpNo"]').each(function () {
var Eachrw = $(this).val(); //getting each row EqpNo
if (SelectRowEqpNo === Eachrw) { //Comparing both values if matching
$('#<%=Abstract_GridView.ClientID %> tr input[id*="SelectChk"]:checkbox').attr('checked', true);
}
});
});
答案 1 :(得分:0)
我会将css类添加到隐藏字段(仅适用于更简单的jQuery选择器):
<asp:HiddenField ID="EqpNo" runat="server" value='<%# Bind("Equipmnt_No") %>' class="EqpNo" />
UPD:哎呀。出现那个课程根本不允许......奇怪...... 代码已更新以反映该内容。
而不是使用如下代码:
$('.DivGrid').delegate('tr', 'click', function () {
var SelectRowEqpNo = $(this).find("input.EqpNo").val();
$(this).closest("table").find('tr input[id*="SelectChk"][value="'+SelectRowEqpNo+'"]')
.each(function() {
$("this").closest("tr").find(".smallCheckbox").attr('checked', true);
});
});
希望括号没有错误
另请注意,我已删除所有#<%=Abstract_GridView.ClientID %>
和类似内容,并将其替换为查找与当前点击的tr相关的元素的函数(如.closest
,.find
)。现在它完全独立于ID,代码更清晰,可以轻松放入外部类
答案 2 :(得分:0)
这是整个代码的工作原理。我已经改变了if块中的jQuery行:
<asp:GridView GridLines="None" ID="Abstract_GridView" runat="server" AutoGenerateColumns="False"
CssClass="Grid" CellPadding="0">
<Columns>
<asp:TemplateField HeaderText="Select">
<HeaderTemplate>
<asp:CheckBox ID="AllChk" runat="server" TabIndex="3" CssClass="smallCheckbox" />
</HeaderTemplate>
<ItemStyle HorizontalAlign="Center" />
<ItemTemplate>
<asp:CheckBox ID="SelectChk" runat="server" TabIndex="5" CssClass="smallCheckbox" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:HiddenField ID="EqpNo" runat="server" Value='<%# Bind("Equipmnt_No") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:Label ID="lbl" runat="server" Text='<%# Bind("Equipmnt_No") %>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
jQuery块:
$(document).ready(function () {
$('#<%=Abstract_GridView.ClientID %>').delegate('tr', 'click', function () {
var SelectRowEqpNo = $(this).find("input[id*=EqpNo]").attr("value"); //trying to get the clicked row EqpNo
$('#<%=Abstract_GridView.ClientID %> tr input[id*="EqpNo"]').each(function (i, v) {
var Eachrw = $(this).val(); //getting each row EqpNo
if (SelectRowEqpNo == Eachrw) { //Comparing both values if matching
$(this).parents("tr").find('input[id*="SelectChk"]:checkbox').attr('checked', true);
}
});
});
});
基本上:找到所有者tr遍历DOM,然后找到再次遍历DOM的复选框。
希望这有帮助。