web-dev-qa-db-ja.com

asp.netラジオボタンのグループ化

現在、ラジオボタンとグループ化に問題があります。リピーターコントロール内にASPラジオボタンがあります。グループ名属性を「顧客」に設定しています。ページが読み込まれるとき、ラジオボタンはグループ化されません。 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>
29
fizch

最後に、プレーンなラジオボタンを作成し、サーバー側のevalを使用して値を設定することで、これを回避しました。

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

次に、アプリケーションがポストバックを実行するときに、Request.Form ["radCustomer"]の値を確認します。これは問題なく動作します。

48
fizch

残念ながら、これは リピーター内のラジオボタンに関する既知の問題 です。唯一のオプションの1つは、RadioButtonクラスから派生したカスタムサーバーコントロールを作成し、そのレンダリング方法をオーバーライドすることです。

[〜#〜] edit [〜#〜]:派生クラスの例を以下に示します。

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>");
    }
}
19
CAbbott

私はそれをJavaScriptで修正しました

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

同じ問題がありました。リテラルをプレースホルダーとして使用して、ラジオボタンのonItemCreatedイベントをレンダリングしています。

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\">";
}
4
Gaurang Jadia

上記のr3dskyが投稿した回答を少し変更する必要がありました。

これが私のために働いたものです:

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

これは、ラジオボタンを使用したASP.NETリピーターのよく知られたバグです。 私の意見では、ここでの最善の解決策

0
hmfarimani

ラジオボタンの自動ポストバックをtrueに設定してから、イベントハンドラーで他​​のすべてのラジオボタンを非選択に設定しました。

理想的ではありませんが、ラジオボタンの可視性と有効化された属性を細かく制御する必要があります。クライアント側のスクリプトに頼るよりも、ASP.NETで制御する方が簡単に思えました。

0
Matthew Lock

他のものと同様の私の解決策:

<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();
});
0
Tone Škoda

まず、ラジオボタンValue = '<%#Eval( "Customer Number")%>'に値を追加します。

0

これは私がしました:

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

どうして?必要な文字列のnameプロパティを置き換えると、「見つかりません」エラーが発生するためです。したがって、最初のラジオボタンの名前を取得し、それらすべてをその名前に変更する必要があります。それはシャルムのように機能します;)

0
cyber