获取 RadioButtonList 值的 jQuery 函数

Question

我有以下 HTML 代码：

<tr>
<td>
    <span>Random question here?</span>
</td>
<td>
    <asp:RadioButtonList ID="someList" runat="server" SelectedValue="<%# Bind('someValue') %>" RepeatDirection="Horizontal" CssClass="radioList">
        <asp:ListItem Text="Yes" Value="1"></asp:ListItem>
        <asp:ListItem Text="No" Value="4"></asp:ListItem>
        <asp:ListItem Text="Don't Know" Value="2"></asp:ListItem>                                        
    </asp:RadioButtonList>
</td>
<td>
    <asp:TextBox ID="txtSomeValue" runat="server" Height="16px" CssClass="someScore" Enabled="false" Text="0"></asp:TextBox>
</td>
</tr>
<tr>
<td>
    <asp:TextBox ID="txtSomeTotal" runat="server" Height="16px" CssClass="someTotal" Enabled="false" Text="0"></asp:TextBox>
    <asp:Label ID="lblTFTotal" runat="server" Font-Bold="true" Font-Italic="true" Text="Your selected value is"></asp:Label>
</td>
</tr>

我需要编写一个 jQuery 函数，用从 RadioButtonList 中选择的值填充“txtSomeValue”文本框，然后将所有选择的值（从这些 RadioButtonList 中的大约 10 个）计算到“txtSomeTotal”文本框中。

我对 jQuery 很陌生。任何帮助都会很棒。

谢谢

Answer 1

  <asp:RadioButtonList ID="rblRequestType">
        <asp:ListItem Selected="True" Value="value1">Value1</asp:ListItem>
        <asp:ListItem Value="Value2">Value2</asp:ListItem>
  </asp:RadioButtonList>

您可以访问这样的列表项；

var radio0 = $("#rblRequestType_0");
var radio1 = $("#rblRequestType_1");

if (radio0.checked){
// do something
}
if (radio1.checked){
// do something
}

Answer 2

Ivan 几乎明白了 - 但有一个更快的方法。使用 JQuery 选择 RBL，然后按所选输入过滤：

$("#<%# rbRadioButtonListId.ClientID %> input:radio:checked").val();

无需捕获表格或单选按钮的名称。

Answer 3

我用过：

$('#<%= rbRadioButtonListId.ClientID %>').children().children().children().find("input:checked").val();

“子”选择器太多，因为生成的 html 用于表示单选按钮列表（table > tbody > tr > td > input）。

希望这个答案能帮助那些找不到解决问题的合适方法的人。

Answer 4

您的主要问题是选择单选按钮，因为单选按钮列表 id 与包装单选按钮的表格相关。一旦你得到它，它只是获取你想要更新的字段的一个例子。我建议将一个类分配给

标记以使其更容易：

<tr class="mainRow">
<td>
    <span>Random question here?</span>
</td>
<td> ....

然后使用类似的东西

    <script>
    $(document).ready(function () {
        $('.radioList input').click(function () {
            /* get the value of the radio button that's been clicked */
            var selectedValue = $(this).val();
            /* assign it to the nearest text box with a class of someScore */
            $(this).closest('.mainRow').find('.someScore').val(selectedValue);
            /* calculate the value of all the text boxes with a class of someScore */
            var currentTotal = 0;
            $('.someScore').each(function () {
                if (!isNaN($(this).val())) {
                    currentTotal += Number($(this).val());
                }
            });
            /* assign it to the text box that displays the total */
            $('#<%=txtSomeTotal.ClientID %>').val(currentTotal);
        });
    });
</script>

【讨论】：

Answer 5

列表中的所有单选按钮都应使用相同的名称属性呈现。查看它，并将其用作脚本中的选择器。像这样的东西应该可以工作：

$('input:radio[name=NameOfRadioButtons]:checked').val();

Answer 6

要使用 jQuery 填充文本框，您应该使用 val() 函数。

$("#ID").val("Text to put in the textbox").

因为 ASP.NET 更改了 .net 对象的 ID，所以您必须这样做：

$("#<%= txtSomeValue.ClientID %>").val("Text to put in the textbox").

这就够了吗？