在 Repeater 中设置每个 CheckBoxList 选择的最大值
Set maximum selected per CheckBoxList in Repeater
我在 Repeater
:
中有一个动态 CheckBoxList
<asp:Repeater ID="rpt1" runat="server" OnItemDataBound="rpt1_ItemDataBound">
<ItemTemplate>
<asp:HiddenField ID="hf1" runat="server" Value='<%# Eval("Id") %>' />
<asp:TextBox ID="txt" runat="server" Text='<%# Eval("Question") %>'></asp:TextBox>
<asp:CheckBoxList ID="chk1" runat="server" Width="100%" RepeatColumns="3" RepeatLayout="Table" RepeatDirection="Horizontal></asp:CheckBoxList>
</ItemTemplate>
</asp:Repeater>
我希望用户只 choose/select 3 个项目。我尝试了很多解决方案,包括这个:
var limit = 10;
$(function () {
$('[id*="chk1"]').on('change', function (evt) {
if ($('[id*="chk1"]:checked').length > limit) {
this.checked = false;
alert('You can only choose ' + limit);
}
});
});
它确实有效,但如果 Repeater
生成了多个 CheckBoxList
,如果我 select 另一个 CheckBoxList
中的另一个项目,则限制仍然有效。
这意味着如果我在 CheckBoxList
第一选择 8 个项目,那么我只能在 CheckBoxList
第二选择 2 个项目,但目标是限制 select 个项目每个 CheckBoxList
.
到 10
有什么解决办法吗?
将$('[id*="chk1"]:checked')
更改为:
$(this).parent().closest('[id*=rpt1]').find('[id*="chk1"]:checked')
测试对象:
<table id="MainContent_rpt1_chk1_0">
<tbody>
<tr>
<td>
<input id="MainContent_rpt1_chk1_0_0_0" type="checkbox" />
</td>
<td>
<input id="MainContent_rpt1_chk1_0_1_0" type="checkbox" />
</td>
</tr>
</tbody>
</table>
<table id="MainContent_rpt1_chk1_1">
<tbody>
<tr>
<td>
<input id="MainContent_rpt1_chk1_0_0_0" type="checkbox" />
</td>
<td>
<input id="MainContent_rpt1_chk1_0_1_0" type="checkbox" />
</td>
</tr>
</tbody>
</table>
我在 Repeater
:
CheckBoxList
<asp:Repeater ID="rpt1" runat="server" OnItemDataBound="rpt1_ItemDataBound">
<ItemTemplate>
<asp:HiddenField ID="hf1" runat="server" Value='<%# Eval("Id") %>' />
<asp:TextBox ID="txt" runat="server" Text='<%# Eval("Question") %>'></asp:TextBox>
<asp:CheckBoxList ID="chk1" runat="server" Width="100%" RepeatColumns="3" RepeatLayout="Table" RepeatDirection="Horizontal></asp:CheckBoxList>
</ItemTemplate>
</asp:Repeater>
我希望用户只 choose/select 3 个项目。我尝试了很多解决方案,包括这个:
var limit = 10;
$(function () {
$('[id*="chk1"]').on('change', function (evt) {
if ($('[id*="chk1"]:checked').length > limit) {
this.checked = false;
alert('You can only choose ' + limit);
}
});
});
它确实有效,但如果 Repeater
生成了多个 CheckBoxList
,如果我 select 另一个 CheckBoxList
中的另一个项目,则限制仍然有效。
这意味着如果我在 CheckBoxList
第一选择 8 个项目,那么我只能在 CheckBoxList
第二选择 2 个项目,但目标是限制 select 个项目每个 CheckBoxList
.
有什么解决办法吗?
将$('[id*="chk1"]:checked')
更改为:
$(this).parent().closest('[id*=rpt1]').find('[id*="chk1"]:checked')
测试对象:
<table id="MainContent_rpt1_chk1_0">
<tbody>
<tr>
<td>
<input id="MainContent_rpt1_chk1_0_0_0" type="checkbox" />
</td>
<td>
<input id="MainContent_rpt1_chk1_0_1_0" type="checkbox" />
</td>
</tr>
</tbody>
</table>
<table id="MainContent_rpt1_chk1_1">
<tbody>
<tr>
<td>
<input id="MainContent_rpt1_chk1_0_0_0" type="checkbox" />
</td>
<td>
<input id="MainContent_rpt1_chk1_0_1_0" type="checkbox" />
</td>
</tr>
</tbody>
</table>