JavaScript:如何在 GridView 中查找 RadioButtonList

Question

我正在尝试在 JavaScript 中的 GridView 中查找 RadioButtonList 控件。

function SetPresent(studid) {
    var container = document.getElementById("gvRollCall"); 
    var RB1 = container.getElementById("<%=RadioButtonList1.ClientID%>");
    var radio = RB1.getElementsByTagName("input");
    var label = RB1.getElementsByTagName("label");
    for (var i=0;i<radio.length;i++)
    {
       if (!radio[i].checked)
       {
           //for debugging only
           alert("SelectedText = " + label[i].innerHTML);
           alert("SelectedValue = " + radio[i].value);
       }
    }
    return false;
}

但我总是得到...

Compilation Error

Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately. 

Compiler Error Message: CS0103: The name 'RadioButtonList1' does not exist in the current context

> Source Error:
> 
> 
> Line 142:        function SetPresent(studid) { Line 143:           
> var container = document.getElementById("gvRollCall");  Line 144:     
> var RB1 = $container.getElementById("<%=RadioButtonList1.ClientID%>");

gvRollCall 是我的 GridView。

为什么？

编辑:GridView源码

<asp:GridView ID="gvRollCall" runat="server" AllowSorting="True" AutoGenerateColumns="False" ShowFooter="True" CellPadding="4" ForeColor="#333333"
            DataSourceID="sdsSubmittedRollCall"
            OnDataBound="gvRollCall_DataBound" 
            OnDataBinding="gvRollCall_DataBinding" 
            OnRowDataBound="gvRollCall_RowDataBound">
            <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
            <Columns>
                <asp:TemplateField HeaderText="Student" SortExpression="StudentName">
                    <ItemTemplate>
                        <asp:HiddenField ID="hfStudentID" runat="server" Value='<%# Eval("StudentID") %>' />
                        <asp:HiddenField ID="hfSubmitted" runat="server" Value='<%# Eval("Submitted") %>' />
                        <a id="A1" style="color: blue; text-decoration: underline; cursor: hand; cursor: pointer;"
                           ondblclick='doDblClick("<%# Eval("StudentID") %>")'
                           onclick='doClick("<%# Eval("StudentID") %>")'
                           onmouseover='ShowPhoto("<%# Eval("StudentID") %>");'
                           onmouseout='HidePhoto();'>
                           <%# Eval("StudentName") %>
                        </a>
                    </ItemTemplate>
                    <FooterTemplate>
                        <asp:Button ID="btnSUBMIT" runat="server" OnClick="btnSUBMIT_Click" OnClientClick="return confirm('Are you sure?');" Text="SUBMIT" CausesValidation="true" />
                        <div id="divSubmitted" runat="server" visible="false">
                            <asp:Label ID="lblSubmitted" runat="server" Text="Roll Call Submitted"></asp:Label>
                        </div>
                    </FooterTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Study Year" SortExpression="StudentStudyYear">
                    <ItemTemplate>
                        <asp:Label ID="Label3" runat="server" Text='<%# Eval("StudentStudyYear") %>'></asp:Label>
                    </ItemTemplate>
                    <ItemStyle HorizontalAlign="Center" />
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Status">
                    <ItemTemplate>
                        <asp:Table ID="tblStatus" runat="server" CellPadding="0" CellSpacing="2">
                            <asp:TableRow runat="server">
                                <asp:TableCell>
                                    <asp:HiddenField ID="hfStatusID" runat="server" Value='<%# Eval("CheckStatusID") %>' />
                                    <asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatDirection="Horizontal" AutoPostBack="true" CellPadding="3" 
                                        DataSourceID="sdsStatuses" DataTextField="CheckStatusName" DataValueField="CheckStatusID">
                                    </asp:RadioButtonList>
                                    <asp:SqlDataSource ID="sdsStatuses" runat="server" ConnectionString="<%$ ConnectionStrings:ATCNTV1ConnectionString %>" 
                                        SelectCommand="SELECT CheckStatusID, CheckStatusName FROM tblBoardingCheckStatus WHERE StatusActive = 1">
                                    </asp:SqlDataSource>
                                </asp:TableCell>
                                <asp:TableCell>
                                    <asp:RequiredFieldValidator ID="rfvStatus" runat="server" ControlToValidate="RadioButtonList1" ErrorMessage="Status is required" Text="*"/>
                                </asp:TableCell>
                            </asp:TableRow>
                        </asp:Table>
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
            <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
            <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
            <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <EditRowStyle BackColor="#999999" />
            <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
        </asp:GridView>

还有 doClick() 函数...

function doClick(studid){
          wsTimer = setTimeout(function(){SetPresent(studid)}, 300);
        }

Answer 1

您无法使用此代码直接访问放置在 Gridview 内的 RadiobuttonList。分配 CssClass="radioList" 如下，我在下面的代码中添加了使用 JQuery 的访问跟随列表。

<asp:RadioButtonList CssClass="radioList" ID="RadioButtonList1" runat="server" RepeatDirection="Horizontal" AutoPostBack="true" CellPadding="3" 
                                    DataSourceID="sdsStatuses" DataTextField="CheckStatusName" DataValueField="CheckStatusID">

删除这行代码

var RB1 = container.getElementById("<%=RadioButtonList1.ClientID%>");

并使用这个。将类分配给对象后，您可以循环该每个对象并获取值，如下所示:

function SetPresent(studid) {
$(".radioList").each(function(index, element) {
    alert($(this).find('option:selected').text());
    alert($(this).find('option:selected').val());
});
return false;}