web-dev-qa-db-ja.com

ヌル可能ブールのチェックボックス

私のモデルにはブール値があります

public bool? Foo
{
   get;
   set;
}

私のRazor cshtmlには

@Html.CheckBoxFor(m => m.Foo)

それが機能しないことを除いて。どちらも（bool）でキャストしません。私が行った場合

@Html.CheckBoxFor(m => m.Foo.Value)

エラーは発生しませんが、投稿されたときにモデルにバインドされず、fooがnullに設定されます。ページにFooを表示し、投稿でモデルにバインドするための最良の方法は何ですか？

asp.net-mvc-3razornullable
90
DMulligan

私はそれを使って仕事をしました

@Html.EditorFor(model => model.Foo)

そして、EditorTemplatesフォルダーにBoolean.cshtmlを作成して貼り付けます

@model bool?

@Html.CheckBox("", Model.GetValueOrDefault())

内部。

100
DMulligan

同様の質問に答えが見つかりました- Nullable BoolをCheckBoxとしてレンダリング 。それは非常に簡単で、うまく機能します：

@Html.CheckBox("RFP.DatesFlexible", Model.RFP.DatesFlexible ?? false)
@Html.Label("RFP.DatesFlexible", "My Dates are Flexible")

特別な「エディターテンプレート」を必要としないことを除いて、@ afinkelsteinからの受け入れられた回答に似ています。

39
resnyanskiy

モデルにbool? IsDisabled { get; set; }があります。ビューにある場合に挿入されます。

<div class="inputClass" id="disabled">
    <div>
    @if(Model.IsDisabled==null)
    {
        Model.IsDisabled = false;
    }           
    @Html.CheckBoxFor(model => model.IsDisabled.Value)         
    </div>
</div>
26
VitalyB

私のモデルにはブール値があります

どうして？これは意味がありません。チェックボックスには2つの状態があります。オン/オフ、または必要に応じてTrue/Falseです。 3番目の状態はありません。

または、ビューモデルの代わりにビューでドメインモデルを使用しているのを待ちますか？それはあなたの問題だ。したがって、私にとっての解決策は、単純なブールプロパティを定義するビューモデルを使用することです。

public class MyViewModel
{
    public bool Foo { get; set; }
}

これで、コントローラーアクションがこのビューモデルをビューに渡し、適切なチェックボックスを生成します。

14
Darin Dimitrov

FalseまたはNullが推奨されないかどうかを明確にするために、プリミティブを非表示フィールドで複雑にします。

チェックボックスは、使用すべきものではありません。実際には、状態は1つしかありません：Checked。それ以外の場合は、何でもかまいません。

データベースフィールドがnull入力可能なブール値（bool?）の場合、UXは3-Radioボタンを使用する必要があります。最初のボタンは「チェック済み」、2番目のボタンは「未チェック」、3番目のボタンはnull 、nullのセマンティクスが意味するものは何でも。 <select><option>ドロップダウンリストを使用して不動産を節約することもできますが、ユーザーは2回クリックする必要があり、選択がすぐに明確になるわけではありません。

  1     0      null 
True  False  Not Set
Yes   No     Undecided
Male  Female Unknown
On    Off    Not Detected

RadioButtonForSelectListという名前の拡張機能として定義されたRadioButtonListは、選択/チェックされた値を含むラジオボタンを作成し、<div class="RBxxxx">を設定して、cssを使用してラジオボタンを水平にします（表示：インラインブロック）、垂直、または表形式（表示：インラインブロック;幅：100ピクセル;）

モデルでは（文字列、辞書の定義に文字列を教育的な例として使用しています。bool?、文字列を使用できます）

public IEnumerable<SelectListItem> Sexsli { get; set; }
       SexDict = new Dictionary<string, string>()
        {
                { "M", "Male"},
                { "F", "Female" },
                { "U", "Undecided" },

        };

        //Convert the Dictionary Type into a SelectListItem Type
        Sexsli = SexDict.Select(k =>
              new SelectListItem
              {
                  Selected = (k.Key == "U"),
                  Text = k.Value,
                  Value = k.Key.ToString()
              });

<fieldset id="Gender">
<legend id="GenderLegend" title="Gender - Sex">I am a</legend>
    @Html.RadioButtonForSelectList(m => m.Sexsli, Model.Sexsli, "Sex") 
        @Html.ValidationMessageFor(m => m.Sexsli)
</fieldset>

public static class HtmlExtensions
{
public static MvcHtmlString RadioButtonForSelectList<TModel, TProperty>(
    this HtmlHelper<TModel> htmlHelper,
    Expression<Func<TModel, TProperty>> expression,
    IEnumerable<SelectListItem> listOfValues,
    String rbClassName = "Horizontal")
{
var metaData = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData);
var sb = new StringBuilder();

if (listOfValues != null)
{
    // Create a radio button for each item in the list 
    foreach (SelectListItem item in listOfValues)
    {
        // Generate an id to be given to the radio button field 
        var id = string.Format("{0}_{1}", metaData.PropertyName, item.Value);

        // Create and populate a radio button using the existing html helpers 
        var label = htmlHelper.Label(id, HttpUtility.HtmlEncode(item.Text));

        var radio = String.Empty;

        if (item.Selected == true)
        {
            radio = htmlHelper.RadioButtonFor(expression, item.Value, new { id = id, @checked = "checked" }).ToHtmlString();
        }
        else
        {
            radio = htmlHelper.RadioButtonFor(expression, item.Value, new { id = id }).ToHtmlString();

        }// Create the html string to return to client browser
        // e.g. <input data-val="true" data-val-required="You must select an option" id="RB_1" name="RB" type="radio" value="1" /><label for="RB_1">Choice 1</label> 

        sb.AppendFormat("<div class=\"RB{2}\">{0}{1}</div>", radio, label, rbClassName);
    }
}

return MvcHtmlString.Create(sb.ToString());
}
}
6
Jules Bartow

チェックボックスは2つの値（true、false）のみを提供します。 Nullableブール値には3つの値（true、false、null）があるため、チェックボックスで実行することはできません。

代わりにドロップダウンを使用することをお勧めします。

型

public bool? myValue;
public List<SelectListItem> valueList;

コントローラ

model.valueList = new List<SelectListItem>();
model.valueList.Add(new SelectListItem() { Text = "", Value = "" });
model.valueList.Add(new SelectListItem() { Text = "Yes", Value = "true" });
model.valueList.Add(new SelectListItem() { Text = "No", Value = "false" });

見る

@Html.DropDownListFor(m => m.myValue, valueList)
4
Gudradain

実際にテンプレートを作成し、そのテンプレートをEditorFor（）で使用します。

ここに私がそれをした方法があります：

  1. テンプレートを作成します。これは、基本的にEditorTemplatesディレクトリの[共有]の下の[ビュー]の下に作成した部分ビューです（例：CheckboxTemplate :)。

    @using System.Globalization    
@using System.Web.Mvc.Html    
@model bool?

@{
    bool? myModel = false;
    if (Model.HasValue)
    {
        myModel = Model.Value;
    }
}

<input type="checkbox" checked="@(myModel)" name="@ViewData.TemplateInfo.HtmlFieldPrefix" value="True" style="width:20px;" />

  2. 次のように使用します（どのビューでも）：

    @ Html.EditorFor（x => x.MyNullableBooleanCheckboxToBe、 "CheckboxTemplate"）

それで全部です。

テンプレートはMVCで非常に強力なので、それらを使用します。ページ全体をテンプレートとして作成し、@Html.EditorFor()で使用できます。ビューモデルをラムダ式で渡すことを条件とします。

3
t_plusplus

私が思いつく最もクリーンなアプローチは、HtmlHelperで利用可能な拡張機能を拡張しながら、フレームワークによって提供される機能を再利用することです。

public static MvcHtmlString CheckBoxFor<T>(this HtmlHelper<T> htmlHelper, Expression<Func<T, bool?>> expression, IDictionary<string, object> htmlAttributes) {

    ModelMetadata modelMeta = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData);
    bool? value = (modelMeta.Model as bool?);

    string name = ExpressionHelper.GetExpressionText(expression);

    return htmlHelper.CheckBox(name, value ?? false, htmlAttributes);
}

ネイティブCheckBoxFor<Expression<Func<T, bool>>>へのストレートパススルーを許可するために、表現を「整形」して実験しましたが、それは可能だとは思いません。

3
Red Taz

私にとっての解決策は、ビューモデルを変更することでした。請求書を探しているとします。これらの請求書は支払われる場合と支払われない場合があります。したがって、検索には、有料、未払い、または「気にしない」の3つのオプションがあります。

私はこれをもともとブール値に設定していましたか？フィールド：

public bool? PaidInvoices { get; set; }

これは私にこの質問につまずいた。最終的にEnum型を作成し、これを次のように処理しました。

@Html.RadioButtonFor(m => m.PaidInvoices, PaidStatus.NotSpecified, new { @checked = true })
@Html.RadioButtonFor(m => m.PaidInvoices, PaidStatus.Yes) 
@Html.RadioButtonFor(m => m.PaidInvoices, PaidStatus.No)

もちろん、それらをラベルでラップし、テキストを指定しましたが、ここで考慮すべきもう1つのオプションがあります。

3
Paul

過去にも同様の問題がありました。

HTMLでチェックボックス入力を作成し、属性name = "Foo"を設定します。これでも適切に投稿されるはずです。

<input type="checkbox" name="Foo" checked="@model.Foo.Value" /> Foo Checkbox<br />
1
Chris Lucian

Nullable boolを含むモデルのEditorTemplateを作成する場合...

  • ヌル可能ブールを2つのブール値に分割します。

    // Foo is still a nullable boolean.
public bool? Foo 
{
    get 
    { 
        if (FooIsNull)
            return null;

        return FooCheckbox;  
    }
    set
    {
        FooIsNull   = (value == null);
        FooCheckbox = (value ?? false);
    }
}

// These contain the value of Foo. Public only so they are visible in Razor views.
public bool FooIsNull { get; set; }
public bool FooCheckbox { get; set; }

  • エディターテンプレート内：

    @Html.HiddenFor(m => m.FooIsNull)

@if (Model.FooIsNull)
{
    // Null means "checkbox is hidden"
    @Html.HiddenFor(m => m.FooCheckbox)
}
else
{
    @Html.CheckBoxFor(m => m.FooCheckbox)
}

  • 元のプロパティFooをポストバックしないでください。これは、FooIsNullおよびFooCheckboxから計算されるようになりました。

0
user1023602

拡張メソッド：

        public static MvcHtmlString CheckBoxFor<TModel>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, bool?>> expression)
        {
            return htmlHelper.CheckBoxFor<TModel>(expression, null);
        }
        public static MvcHtmlString CheckBoxFor<TModel>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, bool?>> expression, object htmlAttributes)
        {
            ModelMetadata metadata = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData);
            bool? isChecked = null;
            if (metadata.Model != null)
            {
                bool modelChecked;
                if (Boolean.TryParse(metadata.Model.ToString(), out modelChecked))
                {
                    isChecked = modelChecked;
                }
            }
            return htmlHelper.CheckBox(ExpressionHelper.GetExpressionText(expression), isChecked??false ,  htmlAttributes);
        }
0
Jim

私も同じ問題に直面しました。 DBを変更してEDMXを再度生成したくないため、この問題を解決するために次のアプローチを試みました。

@{

   bool testVar = (Model.MYVar ? true : false);

 }

<label>@Html.CheckBoxFor(m => testVar)testVar</label><br />
0
Amit Kumar

上記のすべての答えは、それ自身の問題に付随していました。 IMOがヘルパーを作成する最も簡単/クリーンな方法

MVC5カミソリ

App_Code/Helpers.cshtml

@helper CheckBoxFor(WebViewPage page, string propertyName, bool? value, string htmlAttributes = null)
{
    if (value == null)
    {
        <div class="checkbox-nullable">
            <input type="checkbox" @page.Html.Raw(htmlAttributes)>
        </div>
    }
    else if (value == true)
    {
        <input type="checkbox" value="true" @page.Html.Raw(htmlAttributes) checked>
    }
    else
    {
        <input type="checkbox" value="false" @page.Html.Raw(htmlAttributes)>
    }
}

使用法

@Helpers.CheckBoxFor(this, "IsPaymentRecordOk", Model.IsPaymentRecordOk)

私のシナリオでは、nullを許可するチェックボックスは、スタッフがクライアントにまだ質問していないことを意味するため、.checkbox-nullableでラップされているため、適切にスタイルを設定し、trueではないことをエンドユーザーが識別できるようにするまたfalse

CSS

.checkbox-nullable {
    border: 1px solid red;
    padding: 3px;
    display: inline-block;
}
0
zanderwar

Null値を確認してfalseを返すだけです：

@{ bool nullableValue = ((Model.nullableValue == null) || (Model.nullableValue == false)) ? false : true; }
@Html.CheckBoxFor(model => nullableValue)
0
Rodrigo Boratto