用于 ASP.NET RadioButtonGroup 的 Javascript 或 JQuery答案

【问题标题】：Javascript or JQuery for ASP.NET RadioButtonGroup用于 ASP.NET RadioButtonGroup 的 Javascript 或 JQuery
【发布时间】：2013-04-05 02:34:48
【问题描述】：

我只需要从客户端的单选按钮组中获取选定的索引。但是，我对 Javascript/JQuery 真的很陌生，并且遇到了一些看起来很奇怪的行为。我在同一张表中有一个下拉列表和一个单选按钮组。在我的脚本中，我有以下内容：

var ddlStatuses = $find("<%= ddlStatuses.ClientID %>");
var rbgAssetClass = $find("<%= rbgAssetClass.ClientID %>");

第一个 $find 工作正常，但第二个返回 null。

所以有两个问题。找到我的单选按钮组并获取其选定索引的最佳方法是什么？为什么 $find 在同一个表中找到其中一个控件而不找到另一个？

谢谢

编辑显示aspx：

    <asp:Panel ID="pnlSelectRoom" CssClass="pnlSelectRoom" runat="server" Width="930px">
        <asp:Table ID="Table1" runat="server" class="tblSelectRoomLayout" Width="100%">
            <asp:TableRow>
                <asp:TableCell>
                    <asp:Label ID="Label6" runat="server" Text="Data Center" Font-Size="Small" </asp:Label>
                </asp:TableCell>
                <asp:TableCell>
                    <asp:DropDownList Width="225px" ID="ddlDataCenter" runat="server" onchange="PopulateRooms(this);"
                        ZIndex="9001" Font-Size="Small" DataValueField="Id" DataTextField="Name" >
                    </asp:DropDownList>
                </asp:TableCell>
                <asp:TableCell>
                    <asp:Label ID="Label7" runat="server" Text="Room" Font-Size="Small"></asp:Label>
                </asp:TableCell>
                <asp:TableCell>
                    <asp:DropDownList Width="225px" ID="ddlRooms" runat="server"  ZIndex="9001" Enabled ="false">
                    </asp:DropDownList>
                </asp:TableCell>
                <asp:TableCell>
                    <asp:Label ID="Label8" runat="server" Text="Asset Status"></asp:Label>
                </asp:TableCell>
                <asp:TableCell>
                    <telerik:RadComboBox Width="225px" runat="server" ID="ddlStatuses" DataValueField="ID"
                        DataTextField="Text" CheckBoxes="true" EnableCheckAllItemsCheckBox="True" ZIndex="9001" CausesValidation="false">
                    </telerik:RadComboBox>                        
                </asp:TableCell>
            </asp:TableRow>
            <asp:TableRow Width="100%">
                <asp:TableCell ColumnSpan="6" HorizontalAlign="Center">
                    <asp:RadioButtonList CssClass="checkBoxAlign" ID="rbgAssetClass" runat="server" AutoPostBack="false"
                        RepeatDirection="Horizontal"
                        Font-Size="Small">
                        <asp:ListItem Selected="True">Base Assets&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</asp:ListItem>
                        <asp:ListItem>Contained Assets&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</asp:ListItem>
                        <asp:ListItem>SubContained Assets</asp:ListItem>
                        <asp:ListItem>All Assets&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</asp:ListItem>
                    </asp:RadioButtonList>
                </asp:TableCell>
            </asp:TableRow>
        </asp:Table>
    </asp:Panel>

【问题讨论】：

你能发布带有 readio 按钮的 asp 代码吗？

标签： javascript jquery asp.net

【解决方案1】：

请注意，HTML 中没有 RadioButtonList，因此当您编写 $find("<%= rbgAssetClass.ClientID %>"); 时，您可能无法得到您期望的结果。检查生成的 HTML 以查看您想要查找哪个 ID，或添加更多关于您想要完成的内容的信息

【讨论】：

好的，有道理。 RadioButtonList 呈现为具有相同 ID 的表。即使名称“MainContent_ctl00_rbgAssetClass”是正确的，它也不是具有项目列表的对象。这就是为什么我需要 Shekhar 的回答才能获得输入。

【解决方案2】：

你可以像下面那样做。

在 JavaScript 中，控件是内容页还是母版页并不重要

<asp:CheckBoxList ID="chkModuleList"runat="server" />

<asp:CustomValidator runat="server" ID="cvmodulelist"
  ClientValidationFunction="ValidateModuleList"
  ErrorMessage="Please Select Atleast one Module" />

// javascript to add to your aspx page
function ValidateModuleList(source, args)
{
  var chkListModules= document.getElementById ('<%= chkModuleList.ClientID %>');
  var chkListinputs = chkListModules.getElementsByTagName("input");
  for (var i=0;i<chkListinputs .length;i++)
  {
    if (chkListinputs [i].checked)
    {
      args.IsValid = true;
      return;
    }
  }
  args.IsValid = false;
}

更新： 或者你可以通过这种方法：把任何css-class说company。你可以通过下面。

您可以使用:checked (http://api.jquery.com/checked-selector/) 选择器：

<script>
    $(document).ready(function() {
        $(".company input").click(function() {
            var cnt = $(".company input:checked").length;
            if (cnt == 0)
            {
               // none checked
            }
            else
            {
               // any checked
            }
        });
    });
</script>

您可能希望在这些复选框的容器上添加（或使用）一个 id，以优化选择器速度。

至于asp.net在控件上弄乱客户端ID，你可以使用

$('<%= MyControl.ClientID %>')

参考资料：

【讨论】：

不是 ClientID 搞砸了，只是没有为单选按钮列表呈现对象，只有单选按钮表。但是您提供的用于访问单选按钮并检查选中属性的方法非常有效。谢谢。