如何根据选定的单选按钮定位特定列的值？(jquery)

Question

我正在使用ASP.Net webforms，在检索未链接到单选按钮的数据网格值时遇到问题。基本上，我希望使用jquery在与所选单选按钮相同的行上检索特定列的值(例如:person的SSN)。目前，该单选按钮用于检索报告。我该怎么做呢？下面是当前设置datagrid的方式。

​

<asp:Content ID="Content2" ContentPlaceHolderID="content" runat="server">
    <div class="confirmation">
        <div class="row confirmation-content">
            <div class="col-sm-12" style="height: 340px; overflow-y: scroll;">
                <asp:DataGrid ID="dgReports" CssClass="table table-condensed table-striped table-bordered  grid" runat="server" PageSize="25"
                    OnItemDataBound="dgReports_ItemDataBound" DataKeyField="ReportId" OnSortCommand="dgReports_Sort" AllowSorting="True" Width="100%" AllowPaging="False"
                    AutoGenerateColumns="False">
                    <Columns>
                        <asp:TemplateColumn SortExpression="FullName" HeaderText="Borrower" HeaderStyle-CssClass="col-sm-6"
                            ItemStyle-CssClass="col-sm-6">
                            <ItemTemplate>
                                <input type="radio" class=" radio" name="rbJoinReport" value='<%# DataBinder.Eval(Container, "DataItem.ReportId") %>'
                                    id='<%# "rbJoinReport" + DataBinder.Eval(Container, "DataItem.ReportId").ToString() %>'
                                    onclick="OnRadioClick(this); ">
                                <label for='<%# "rbJoinReport" + DataBinder.Eval(Container, "DataItem.ReportId").ToString() %>' title=" <%# DataBinder.Eval(Container, "DataItem.FullName") %>">
                                    <span id='<%# "rbJoinReport" + DataBinder.Eval(Container, "DataItem.ReportId").ToString() + "lbl" %>' class="borrower-name" style="max-width: 400px">
                                        <%# DataBinder.Eval(Container, "DataItem.FullName") %>
                                    </span>
                                </label>
                            </ItemTemplate>
                        </asp:TemplateColumn>
                        <asp:TemplateColumn HeaderText="View" ItemStyle-CssClass="col-sm-1" HeaderStyle-CssClass="col-sm-1">
                            <ItemTemplate>
                                <asp:HyperLink ID="hlApplicant" Text="(View)" runat="server" NavigateUrl='<%# DataBinder.Eval(Container, "DataItem.ReportId", "../ViewReport.aspx?ReportId={0}") %>' onmouseover="window.status='View Report';return true;" onmouseout="window.status='';return true;"
                                    onclick="window.open(this.href,'_blank','toolbar=no,location=no,status=no,menubar=yes,scrollbars=yes,resizable=yes,width=800',''); return false;">
                                </asp:HyperLink>
                            </ItemTemplate>
                        </asp:TemplateColumn>
                        <asp:TemplateColumn SortExpression="boSSN" HeaderText="SSN" ItemStyle-CssClass="col-sm-2" HeaderStyle-CssClass="col-sm-2">
                            <ItemTemplate>
                                <span><%# DataBinder.Eval(Container, "DataItem.boSSN") %></span>
                            </ItemTemplate>
                        </asp:TemplateColumn>
                        <asp:TemplateColumn SortExpression="UserReference" HeaderText="Reference" ItemStyle-CssClass="col-sm-2" HeaderStyle-CssClass="col-sm-2">
                            <ItemTemplate>
                                <span><%# DataBinder.Eval(Container, "DataItem.UserReference") %></span>
                            </ItemTemplate>
                        </asp:TemplateColumn>
                        <asp:TemplateColumn SortExpression="RequestDate" HeaderText="Run" ItemStyle-CssClass="col-sm-1" HeaderStyle-CssClass="col-sm-1">
                            <ItemTemplate>
                                <span><%# DataBinder.Eval(Container, "DataItem.RequestDate", "{0:MM/dd/yyyy}") %></span>
                            </ItemTemplate>
                        </asp:TemplateColumn>
                    </Columns>
                </asp:DataGrid>
            </div>
        </div>
        <div class="row   confirmation-footer">
            <div class="col-sm-12">
                <div class="pull-right">
                    <input type="button" value="Cancel" class="btn btn-sm btn-danger  confirmation-cancel" id="btnCancel" name="Button1">
                    <input type="button" value="Join" class="btn btn-sm btn-primary  confirmation-value" id="btnJoin" name="Button2" tabindex="1" disabled>
                </div>
            </div>
        </div>
    </div>
</asp:Content>

​

Answer 1

考虑到您的SSN是一个输入字段，这就是您可能要做的。

从asp.net数据网格转换的标记

<table>
<tr>
<td>
<input type="text" attr="ssn"></input>
</td>
<td>
<input type="radio"></input>
</td>
</tr>
</table>

<script>
$().ready(function()
{
$('input:radio').click(function()
{
   alert($(this).parent().parent().find("input[attr=ssn]").val());
});
});
</script>

我在元素上使用了一个属性'attr‘来定位特定的字段。您也可以使用类或任何特殊符号。

编辑：

如果你想把它赋给一个变量：

var ssnField = $(this).parent().parent().find("input[attr=ssn]");

http://jsfiddle.net/cfom5j1e/