はい/いいえラジオボタンをASP.NET MVCの厳密に型指定されたモデルのブール型プロパティにバインドする方法を知っている人はいますか。
型
public class MyClass
{
public bool Blah { get; set; }
}
見る
<%@ Page Title="blah" Inherits="MyClass"%>
<dd>
<%= Html.RadioButton("blah", Model.blah) %> Yes
<%= Html.RadioButton("blah", Model.blah) %> No
</dd>
ありがとう
解決:
ブライアンの指示に感謝しますが、それは彼が書いたものの反対でした。そう-
<%@ Page Title="blah" Inherits="MyClass"%>
<dd>
<%= Html.RadioButton("blah", !Model.blah) %> Yes
<%= Html.RadioButton("blah", Model.blah) %> No
</dd>
2番目のパラメーターが選択されているため、!ブール値がfalseの場合に値なしを選択します。
<%= Html.RadioButton("blah", !Model.blah) %> Yes
<%= Html.RadioButton("blah", Model.blah) %> No
MVC 3とRazorを使用している場合は、次も使用できます。
@Html.RadioButtonFor(model => model.blah, true) Yes
@Html.RadioButtonFor(model => model.blah, false) No
アクセシビリティの理由でfieldset
を使用し、最初のボタンをデフォルトとして指定するより完全な例を次に示します。 fieldset
がないと、ラジオボタンが全体として何のためにあるかをプログラムで決定できません。
モデル
public class MyModel
{
public bool IsMarried { get; set; }
}
表示
<fieldset>
<legend>Married</legend>
@Html.RadioButtonFor(e => e.IsMarried, true, new { id = "married-true" })
@Html.Label("married-true", "Yes")
@Html.RadioButtonFor(e => e.IsMarried, false, new { id = "married-false" })
@Html.Label("married-false", "No")
</fieldset>
@checked
引数を匿名オブジェクトに追加して、ラジオボタンをデフォルトとして設定できます。
new { id = "married-true", @checked = 'checked' }
true
とfalse
を文字列値で置き換えることにより、文字列にバインドできることに注意してください。
Benの答えから少し構築して、ラベルを使用できるようにIDの属性を追加しました。
<%: Html.Label("isBlahYes", "Yes")%><%= Html.RadioButtonFor(model => model.blah, true, new { @id = "isBlahYes" })%>
<%: Html.Label("isBlahNo", "No")%><%= Html.RadioButtonFor(model => model.blah, false, new { @id = "isBlahNo" })%>
これがお役に立てば幸いです。
通常のHTMLを使用してラジオボタンの周りにラベルタグを追加すると、「labelfor」の問題も修正されます。
<label><%= Html.RadioButton("blah", !Model.blah) %> Yes</label>
<label><%= Html.RadioButton("blah", Model.blah) %> No</label>
テキストをクリックすると、適切なラジオボタンが選択されます。
またはMVC 2.0:
<%= Html.RadioButtonFor(model => model.blah, true) %> Yes
<%= Html.RadioButtonFor(model => model.blah, false) %> No
帽子を指輪に放り込めば、ラジオボタンの機能を再利用するための既存の回答よりもクリーンな方法があると思います。
ViewModelに次のプロパティがあるとします。
Public Class ViewModel
<Display(Name:="Do you like Cats?")>
Public Property LikesCats As Boolean
End Class
再利用可能な editor template を使用して、そのプロパティを公開できます。
まず、ファイルViews/Shared/EditorTemplates/YesNoRadio.vbhtml
を作成します
次に、YesNoRadio.vbhtmlに次のコードを追加します。
@ModelType Boolean?
<fieldset>
<legend>
@Html.LabelFor(Function(model) model)
</legend>
<label>
@Html.RadioButtonFor(Function(model) model, True) Yes
</label>
<label>
@Html.RadioButtonFor(Function(model) model, False) No
</label>
</fieldset>
Viewでテンプレート名を手動で指定することにより、プロパティのエディターを呼び出すことができます。
@Html.EditorFor(Function(model) model.LikesCats, "YesNoRadio")
長所:
これを拡張メソッドにパッケージ化することで、(1)ラベルとラジオを一度に生成できるようになり、(2)自分のIDを指定することに煩わされる必要がなくなりました。
public static class HtmlHelperExtensions
{
public static MvcHtmlString RadioButtonAndLabelFor<TModel, TProperty>(this HtmlHelper<TModel> self, Expression<Func<TModel, TProperty>> expression, bool value, string labelText)
{
// Retrieve the qualified model identifier
string name = ExpressionHelper.GetExpressionText(expression);
string fullName = self.ViewContext.ViewData.TemplateInfo.GetFullHtmlFieldName(name);
// Generate the base ID
TagBuilder tagBuilder = new TagBuilder("input");
tagBuilder.GenerateId(fullName);
string idAttr = tagBuilder.Attributes["id"];
// Create an ID specific to the boolean direction
idAttr = String.Format("{0}_{1}", idAttr, value);
// Create the individual HTML elements, using the generated ID
MvcHtmlString radioButton = self.RadioButtonFor(expression, value, new { id = idAttr });
MvcHtmlString label = self.Label(idAttr, labelText);
return new MvcHtmlString(radioButton.ToHtmlString() + label.ToHtmlString());
}
}
使用法:
@Html.RadioButtonAndLabelFor(m => m.IsMarried, true, "Yes, I am married")