2

現在、Bootstrap V3 と MVC4 を使用しています。

ブートストラップで定義されたラジオ ボタンを使用したデータへのアクセスとフォーマットに問題があります。

次を使用してラジオボタンを宣言すると-具体的にはdata-toggle="buttons"：

       <div class="btn-group" data-toggle="buttons" style="padding-bottom:10px">
    <label class="btn btn-primary">
        @Html.RadioButtonFor(model => model.searchType, "radiobutton1") RadioButton 1
    </label>


    <label class="btn btn-primary">
        @Html.RadioButtonFor(model => model.searchType, "radiobutton2") RadioButton2
    </label>
 </div>

結果は次のとおりです。

ラジオボタン

すべてが完璧に見えます。ボタンを選択すると、他のボタンを選択するまで押し続けられます。

ただし、フォームを送信すると、値がコントローラーに渡されません。ヌルです。ページ上のテキスト ボックスとラジオ ボタンから値を取得する、厳密に型指定されたビューがあります。

次を使用してラジオボタンを定義する場合-具体的にはdata-toggle="buttons-radio"：

    <div class="btn-group" data-toggle="buttons-radio" style="padding-bottom:10px">

        <label class="btn btn-primary">
            @Html.RadioButtonFor(model => model.searchType, "radiobutton1") RadioButton 1
        </label>


        <label class="btn btn-primary">
            @Html.RadioButtonFor(model => model.searchType, "radiobutton2") RadioButton2
        </label>
</div>

私の結果は

ラジオボタン

これは私のボタンが欲しい方法ではありません。小さな円が見えます。言うまでもなく、ボタンの 1 つを選択すると後戻りはできません。私はそれを維持することを余儀なくされ、他のオプションを選択することはできません.

このオプションの 1 つの良い点は、選択した値をコントローラーに渡すことができることです。フォームが送信されると、モデル オブジェクトの searchType の値が Radiobutton1 または Radiobutton2 のいずれかであることがわかります。

不思議に思っている人のために、これが私のモデルの外観です。これには、searchType と searchString の場所があります。

public class SearchForm
{

    public string searchString{ get; set; }

    public string searchType { get; set; }
}

私が求めているのは、2 つの結果をどのように組み合わせるかということです。

1 つは完璧に見えますがデータを渡しません。もう 1 つは見栄えが悪く、日付を渡します。

または のいずれかdata-toggleに設定されているプロパティに絞り込みました。ButtonsButtons-Radio

4

2 に答える 2

7

実際に行う必要があるのは、各ラジオ ボタンにname属性を追加し、必要なモデル アイテムに設定することだけです。次に、asp.net MVC がブードゥー マジックを実行し、ビットを結合します。あなたの場合、以下のコードのようなものが機能するはずです:

<div class="btn-group" data-toggle="buttons" style="padding-bottom:10px">
    <label class="btn btn-primary">
        @Html.RadioButtonFor(model => model.searchType, "radiobutton1", new {name="searchType"}) RadioButton 1
    </label>

    <label class="btn btn-primary">
        @Html.RadioButtonFor(model => model.searchType, "radiobutton2", new {name="searchType"}) RadioButton2
    </label>
</div>
于 2013-11-21T21:24:32.030 に答える