启用/禁用某些文本框控件基于中继器中单选按钮列表的选定值

Question

很抱歉再次打扰你们。

当 RadioButtonList 控件位于中继器内部但文本框控件位于外部时，以下脚本将起作用。

<script type="text/javascript">
$(document).ready(function() {
$('#rblStatus input').change(function () {
if ($(this).val() == "Yes") {
$("#txtOnwerName").prop("disabled", true);
}
else {
$("#txtOnwerName").prop("disabled", false);
}
});
});
</script>

但是，我现在面临的问题是 RadioButtonList 控件和文本框(大约 5 个(都在中继器控件内。

因此，无论选中单选按钮列表的"是"或"否"值，都不会禁用或启用任何文本框。

知道我做错了什么吗？

例：

<form ID="form1" runat="server">
<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<asp:RadioButtonList ID="rblIssues" runat="server" RepeatDirection="Horizontal" TextAlign="Right">
<asp:ListItem Text="Yes" />
<asp:ListItem Text="No" />
</asp:RadioButtonList><br />
<asp:TextBox ID="txtOnwerName" runat="server"></asp:TextBox>
</ItemTemplate>
</asp:Repeater>
</form>

Answer 1

你检查过生成的html吗？如果是这样，您将看到控件的 ID 已重命名。因此，您需要按ClientID或类名访问它们。

首先，将 ItemTemplate 的每个内容包装在初学者的<div>中。现在的方式是不可能将一个中继器项目与另一个中继器项目区分开来。

<div class="repeaterItem">
<asp:RadioButtonList ID="rblIssues" runat="server" RepeatDirection="Horizontal" TextAlign="Right">
<asp:ListItem Text="Yes" />
<asp:ListItem Text="No" />
</asp:RadioButtonList><br />
<asp:TextBox ID="txtOnwerName" runat="server"></asp:TextBox>
</div>

现在，您可以找到基于repeaterItem类的项目。 检查值并启用/禁用文本框。

<script type="text/javascript">
$('.repeaterItem input[type="radio"]').change(function () {
if ($(this).val() == "Yes") {
$(this).closest('div').children('input[type="text"]').prop("disabled", true);
}
else {
$(this).closest('div').children('input[type="text"]').prop("disabled", false);
}
});
</script>