Kotak centang untuk boolean nullable

Model saya memiliki boolean yang harus nullable

public bool? Foo
{
   get;
   set;
}

jadi di Razor cshtml saya, saya punya

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

kecuali itu tidak berhasil. Juga tidak melakukan casting dengan (bool). Jika aku melakukan

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

itu tidak membuat kesalahan, tetapi tidak mengikat ke model saya saat diposting dan foo disetel ke null. Apa cara terbaik untuk menampilkan Foo di halaman dan membuatnya terikat ke model saya di postingan?

Saya mendapatkannya untuk dikerjakan

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

dan kemudian membuat Boolean.cshtml di folder EditorTemplates saya dan menempel

@model bool?

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

dalam.

Menemukan jawaban dalam pertanyaan serupa - Rendering Nullable Bool as CheckBox . Ini sangat mudah dan hanya berfungsi:

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

Ini seperti jawaban yang diterima dari @afinkelstein kecuali kita tidak memerlukan 'template editor' khusus

Saya ada bool? IsDisabled { get; set; }di Model. Disisipkan jika di View.

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

Model saya memiliki boolean yang harus nullable

Mengapa? Ini tidak masuk akal. Kotak centang memiliki dua status: dicentang / tidak dicentang, atau Benar / Salah jika Anda mau. Tidak ada negara ketiga.

Atau tunggu Anda menggunakan model domain dalam tampilan Anda, bukan model tampilan? Itu masalahmu. Jadi, solusi bagi saya adalah menggunakan model tampilan di mana Anda akan mendefinisikan properti boolean sederhana:

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

dan sekarang Anda akan meminta tindakan pengontrol Anda meneruskan model tampilan ini ke tampilan dan membuat kotak centang yang sesuai.

Memperumit primitif dengan bidang tersembunyi untuk memperjelas apakah False atau Null tidak disarankan.

Kotak centang bukanlah yang seharusnya Anda gunakan - kotak centang hanya memiliki satu status: Dicentang . Jika tidak, bisa jadi apa saja.

Ketika bidang database Anda adalah boolean nullable ( bool?), UX harus menggunakan 3-Radio Buttons, di mana tombol pertama mewakili "Checked", tombol kedua mewakili "Not Checked" dan tombol ketiga mewakili null Anda, apa pun semantiknya null artinya. Anda dapat menggunakan daftar <select><option>tarik-turun untuk menyelamatkan real estat, tetapi pengguna harus mengeklik dua kali dan pilihannya tidak langsung jelas.

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

RadioButtonList, didefinisikan sebagai ekstensi bernama RadioButtonForSelectList, membangun tombol radio untuk Anda, termasuk nilai yang dipilih / dicentang, dan menyetel <div class="RBxxxx">sehingga Anda dapat menggunakan css untuk membuat tombol radio Anda menjadi horizontal (display: inline-block), vertikal, atau dalam gaya tabel (display: inline-block; width: 100px;)

Dalam model (saya menggunakan string, string untuk definisi kamus sebagai contoh pedagogis. Anda dapat menggunakan bool ?, string)

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());
}
}

Bagi saya, solusinya adalah mengubah model tampilan. Pertimbangkan Anda sedang mencari faktur. Faktur ini bisa dibayar atau tidak. Jadi, penelusuran Anda memiliki tiga opsi: Berbayar, Belum Dibayar, atau "Saya tidak peduli".

Saya awalnya menetapkan ini sebagai bool? bidang:

public bool? PaidInvoices { get; set; }

Ini membuat saya tersandung pada pertanyaan ini. Saya akhirnya membuat tipe Enum dan saya menangani ini sebagai berikut:

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

Tentu saja saya membungkusnya dengan label dan memiliki teks yang ditentukan, maksud saya inilah opsi lain untuk dipertimbangkan.

Kotak centang hanya menawarkan 2 nilai (benar, salah). Boolean nullable memiliki 3 nilai (true, false, null) sehingga tidak mungkin melakukannya dengan kotak centang.

Pilihan yang baik adalah menggunakan drop-down.

Model

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

Kontroler

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

Melihat

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

Saya benar-benar akan membuat template untuk itu dan menggunakan template itu dengan EditorFor ().

Inilah cara saya melakukannya:

1. Buat template Saya, yang pada dasarnya adalah tampilan parsial yang saya buat di direktori EditorTemplates, di bawah Bersama, di bawah Nama Tampilan sebagai (misalnya) 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. Gunakan seperti ini (dalam tampilan apa pun):

   @ Html.EditorFor (x => x.MyNullableBooleanCheckboxToBe, "CheckboxTemplate")

Itu saja.

Template sangat kuat dalam MVC, gunakanlah .. Anda dapat membuat seluruh halaman sebagai template, yang akan Anda gunakan dengan @Html.EditorFor(); asalkan Anda meneruskan model tampilan dalam ekspresi lambda ..

Pendekatan terbersih yang dapat saya hasilkan adalah memperluas ekstensi yang tersedia HtmlHelpersementara masih menggunakan kembali fungsionalitas yang disediakan oleh kerangka kerja.

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);
}

Saya bereksperimen dengan 'membentuk' ekspresi untuk memungkinkan langsung lolos ke native CheckBoxFor<Expression<Func<T, bool>>>tetapi saya rasa itu tidak mungkin.

Saya memiliki masalah serupa di masa lalu.

Buat input Kotak Centang dalam HTML, dan setel atribut name = "Foo" Ini masih harus dikirim dengan benar.

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

Cukup periksa nilai null dan kembalikan false padanya:

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

Saya juga menghadapi masalah yang sama. Saya mencoba pendekatan berikut untuk menyelesaikan masalah karena saya tidak ingin mengubah DB dan menghasilkan EDMX lagi.

@{

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

 }

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

Saat membuat EditorTemplate untuk model yang berisi bool nullable ...

• Bagi bool nullable menjadi 2 boolean:

  // 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; }

• Di dalam template editor:

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

• Jangan memposting balik properti asli Foo, karena itu sekarang dihitung dari FooIsNull dan FooCheckbox.

Semua jawaban di atas datang dengan masalahnya sendiri. Cara termudah / terbersih IMO adalah membuat pembantu

MVC5 Razor

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)>
    }
}

Pemakaian

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

Dalam skenario saya, kotak centang nullable berarti bahwa anggota staf belum mengajukan pertanyaan kepada klien, jadi pertanyaan itu dibungkus .checkbox-nullablesedemikian rupa sehingga Anda dapat menyesuaikan gaya dengan tepat dan membantu pengguna akhir mengidentifikasi bahwa itu bukan trueataufalse

CSS

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

Metode ekstensi:

        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);
        }

Tombol radio berguna, tetapi tidak memungkinkan Anda untuk membatalkan pilihan . Jika Anda menginginkan perilaku ini, pertimbangkan untuk menggunakan drop-down / pilih. Kode berikut akan menghasilkan SelectListdan ini mengikat berhasil ke boolean nullable:

public static SelectList GetBoolTriState()
{
    var items = new List<SelectListItem>
    {
        new SelectListItem {Value = "", Text = ""},
        new SelectListItem {Value = "True", Text = "Yes"},
        new SelectListItem {Value = "False", Text = "No"},
    };

    return new SelectList(items, "Value", "Text");
}

@{  bool testVar = ((bool)item.testVar ? true : false); }
  @Html.DisplayFor(modelItem => testVar)

Anda bisa mencoba seperti ini

@Html.TextBoxFor(m => m.foo, new {   type = "checkbox" })

Ini adalah pertanyaan lama, dan jawaban yang ada menjelaskan sebagian besar alternatif. Tapi ada satu pilihan sederhana, apakah Anda punya bool? di viewmodel Anda, dan Anda tidak peduli dengan null di UI Anda:

@Html.CheckBoxFor(m => m.boolValue ?? false);