ASP.NET单选按钮分组

31

我目前遇到了关于单选按钮和分组的问题。在重复器控件中,我有一个ASP单选按钮。我将组名属性设置为“Customer”。当页面加载时,单选按钮未分组。它将ID字段设置为单选按钮的值字段,而不是组名。我知道我曾尝试在重复器控件之外设置单选按钮并遇到了同样的问题。这里发生了什么?

aspx

<asp:Repeater ID="repCustomers" runat="server">
    <HeaderTemplate>
        <table class="tableDefault" cellpadding="0" cellspacing="0" border="0" style="width: 383px; border: 0px !important">
            <tr>
                <th>&nbsp;</th>
                <th>Cust. No.</th>
                <th>Cust. Name</th>
            </tr>
    </HeaderTemplate>
    <ItemTemplate>
            <tr>
                <td>
                    <asp:RadioButton ID="radCustomer" GroupName="Customer" runat="server" ValidationGroup="Customer" ToolTip='<%#Eval("CustomerNumber") %>' />
                </td>
                <td><%#Eval("CustomerNumber")%></td>
                <td><%#Eval("Name") %></td>
            </tr>
    </ItemTemplate>
    <FooterTemplate>
        </table>
    </FooterTemplate>
</asp:Repeater>

输出 HTML

<table class="tableDefault" cellpadding="0" cellspacing="0" border="0" style="width: 383px; border: 0px !important">
    <tr>
        <th>&nbsp;</th>
        <th>Cust. No.</th>
        <th>Cust. Name</th>
    </tr>

    <tr>
        <td>
            <span title="111111"><input id="ctl00_PrimaryContent_repCustomers_ctl01_radCustomer" type="radio" name="ctl00$PrimaryContent$repCustomers$ctl01$Customer" value="radCustomer" /></span>
        </td>
        <td>111111</td>
        <td>Jeremy's Test</td>
    </tr>

    <tr>
        <td>
            <span title="222222"><input id="ctl00_PrimaryContent_repCustomers_ctl02_radCustomer" type="radio" name="ctl00$PrimaryContent$repCustomers$ctl02$Customer" value="radCustomer" /></span>
        </td>
        <td>222222</td>
        <td>My Test</td>
    </tr>

    <tr>
        <td>
            <span title="333333"><input id="ctl00_PrimaryContent_repCustomers_ctl03_radCustomer" type="radio" name="ctl00$PrimaryContent$repCustomers$ctl03$Customer" value="radCustomer" /></span>
        </td>
        <td>333333</td>
        <td>Jim Bob's BBQ</td>
    </tr>

    <tr>
        <td>
            <span title="444444"><input id="ctl00_PrimaryContent_repCustomers_ctl04_radCustomer" type="radio" name="ctl00$PrimaryContent$repCustomers$ctl04$Customer" value="radCustomer" /></span>
        </td>
        <td>444444</td>
        <td>New Hope Hamburgers</td>
    </tr>

    <tr>
        <td>
            <span title="555555"><input id="ctl00_PrimaryContent_repCustomers_ctl05_radCustomer" type="radio" name="ctl00$PrimaryContent$repCustomers$ctl05$Customer" value="radCustomer" /></span>
        </td>
        <td>555555</td>
        <td>Pied Piper Pizza</td>
    </tr>

    <tr>
        <td>
            <span title="666666"><input id="ctl00_PrimaryContent_repCustomers_ctl06_radCustomer" type="radio" name="ctl00$PrimaryContent$repCustomers$ctl06$Customer" value="radCustomer" /></span>
        </td>
        <td>666666</td>
        <td>Sandy's Subs</td>
    </tr>

    <tr>
        <td>
            <span title="777777"><input id="ctl00_PrimaryContent_repCustomers_ctl07_radCustomer" type="radio" name="ctl00$PrimaryContent$repCustomers$ctl07$Customer" value="radCustomer" /></span>
        </td>
        <td>777777</td>
        <td>Leonard's Lambchops</td>
    </tr>

    <tr>
        <td>
            <span title="888888"><input id="ctl00_PrimaryContent_repCustomers_ctl08_radCustomer" type="radio" name="ctl00$PrimaryContent$repCustomers$ctl08$Customer" value="radCustomer" /></span>
        </td>
        <td>888888</td>
        <td>Dave's Diamond Deli</td>
    </tr>

    <tr>
        <td>
            <span title="999999"><input id="ctl00_PrimaryContent_repCustomers_ctl09_radCustomer" type="radio" name="ctl00$PrimaryContent$repCustomers$ctl09$Customer" value="radCustomer" /></span>
        </td>
        <td>999999</td>
        <td>Ernie's Eatery</td>
    </tr>

</table>

这是哪个版本的ASP.Net? - CAbbott
如果单选按钮的“name”字段相同,而不是“ID”,则它们将分组。 - Ian Kemp
尽管您在评论中提到这是在重复器之外发生的,但我认为这个特定问题与您使用重复器密切相关,正如CAbbott所指出的那样。如果您发现确实是这种情况,您可能需要考虑编辑您的问题标题以反映这一点。 - Beska
10个回答

48

我最终通过创建一个普通的单选按钮并使用服务器端 eval 来设置值来解决了这个问题。

<input type="radio" name="radCustomer" value='<%#Eval("CustomerNumber") %>' />

现在当应用程序执行一次postback时,我检查Request.Form["radCustomer"]的值。这个过程非常顺利。


1
如果我们需要自动回发功能? - Sam
我无法做到这一点,因为我需要<label for=....>,而且如果不将其作为服务器端控件,则无法定位单选按钮。 - Sameer Alibhai
并不完美 - 当表单未通过某种验证时,经过回发后,单选按钮未被选中 - 换句话说:在回发之间选择未被保存。 - Mariusz Ignatowicz

19

很遗憾,这是在重复器内使用单选按钮时的一个已知问题。您唯一的选择之一将是创建一个从RadioButton类派生的自定义服务器控件,并覆盖其呈现方式。

编辑: 这里是可能看起来像的派生类的示例:

public class MyRadioButton : RadioButton
{
    protected override void Render(HtmlTextWriter writer)
    {
        writer.Write("<input id=\"" + base.ClientID + "\" ");
        writer.Write("type=\"radio\" ");
        writer.Write("name=\"" + base.ID + "\" ");
        writer.Write("value=\"" + base.ID + "\" />");
        writer.Write("<label for=\"" + base.ClientID + "\">");
        writer.Write(base.Text);
        writer.Write("</label>");
    }
}

11
哇,这是一个非常严重的功能缺陷。呃。 - Beska
2
这基于这样一个想法,即您可以在重复器的项模板中拥有一个单选按钮组(同一行上的多个单选按钮)。在这种情况下,您将希望基于混淆的ID进行唯一分组,但大多数时候人们想要OP尝试做的事情。 - CAbbott
2
<input /> 标签是自闭合的,不应该在标签内包含结束标签和文本。相应的文本应该使用 <label> 标签替代。最终的输出结果应该像以下代码一样:writer.Write("<input id='" + base.ClientID + "' type='radio' name='" + base.ID + "' value='" + base.ID + "' /><label for='" + base.ClientID + "'>" + base.Text + "</label>"); - FiniteLooper
嗨,为什么将value属性设置为base.ID? - Matthew Lock

11

我用JavaScript修复了它:

$(function () {
  $("#divWithGridViewOrRepeater input:radio").attr("name", "yourGroupName");
}); 

1
如果你要使用这种方法,那么存在很大的混淆风险。请务必对发生的事情进行详细文档记录。 - FiniteLooper

4
我遇到了同样的问题。在onItemCreated事件中,我使用Literal作为占位符来呈现单选按钮。
ASP.NET
<asp:Repeater ID="rpt" runat="server" OnItemCreated="rpt_OnItemCreated">
    <ItemTemplate>
        <asp:Literal ID="lit" runat="server"></asp:Literal>
    </ItemTemplate>
</asp:Repeater>

C#

protected void rpt_OnItemCreated(object sender, RepeaterItemEventArgs e) {
    Literal lit = (Literal)e.Item.FindControl("lit");
    lit.Text = "<input type=\"radio\" name=\"myGroup\">";
}

请注意,在回传时,必须指定单选按钮的name属性(而不仅仅是id),以便在Request.Form中显示! - Captain Sensible

2

我需要稍微修改r3dsky上面发布的答案。

以下是对我有效的操作:

$(document).ready(function () {
        $(".divWithGridViewOrRepeater input:radio").attr("name", "yourGroupName");
    }); 

1

0

我做了这个:

$("input:radio").attr("name", $("input:radio").first().attr("name"));

为什么?因为如果你将name属性替换为任何你想要的字符串,你会得到一个“未找到错误”。所以,你需要获取第一个单选按钮的名称,并使用该名称重命名所有单选按钮。它就像魔法一样;)

0

我将我的单选按钮的autopostback设置为true,然后在事件处理程序中将所有其他单选按钮设置为未选中。

虽然不是理想的解决方案,但我需要对单选按钮的可见性和启用属性进行大量控制,而让ASP.NET控制似乎比诉诸客户端脚本更容易。


0
我会先在我的单选按钮上添加一个值 Value='<%#Eval("CustomerNumber") %>'。

ASP单选按钮控件没有value属性。 - fizch
他可能是指'Text'属性。 ;) - Ian Kemp
不行。我知道它只是要添加一个标签,但我还是想试一下。 - fizch

0

我的解决方案与其他人的类似:

<input id="ctlRadio" runat="server" type="radio" data-fixgroupbug="1" >

// Fixes this ASP.NET bug: if radio input is inside repeater you can't set its name.
// Every input gets set different name by ASP.NET.
// They don't behave as a group. You can select multiple radios.
function fixRadiogroupBug()
{
    $('[type="radio"][data-fixgroupbug]').click(function () {
        $(this).siblings('[type="radio"]').prop('checked', false);
    });
}

$(document).ready(function () {
    fixRadiogroupBug();
});

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接