Casella di controllo per booleano nullable

Il mio modello ha un valore booleano che deve essere annullabile

public bool? Foo
{
   get;
   set;
}

quindi nel mio cshtml Razor ho

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

tranne che non funziona. Nemmeno il casting con (bool). Se lo faccio

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

ciò non crea un errore, ma non si lega al mio modello quando pubblicato e foo è impostato su null. Qual è il modo migliore per visualizzare Foo sulla pagina e associarlo al mio modello su un post?

Ce l'ho con cui lavorare

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

e quindi creare un Boolean.cshtml nella mia cartella EditorTemplates e attaccare

@model bool?

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

dentro.

Risposta trovata in una domanda simile - Rendering Nullable Bool come CheckBox . È molto semplice e funziona:

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

È come una risposta accettata da @afinkelstein tranne che non abbiamo bisogno di uno speciale "modello di editor"

Ho bool? IsDisabled { get; set; }in Model. Inserito se in visualizzazione.

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

Il mio modello ha un valore booleano che deve essere annullabile

Perché? Questo non ha senso. Una casella di controllo ha due stati: selezionata / deselezionata o Vero / Falso se lo desideri. Non esiste un terzo stato.

O aspetti di utilizzare i tuoi modelli di dominio nelle tue viste invece dei modelli di visualizzazione? Questo è il tuo problema. Quindi la soluzione per me è usare un modello di visualizzazione in cui definirai una semplice proprietà booleana:

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

e ora l'azione del controller passerà questo modello di visualizzazione alla visualizzazione e genererà la casella di controllo appropriata.

Complicare una primitiva con campi nascosti per chiarire se False o Null non è consigliato.

Casella di controllo non è quello che si dovrebbe utilizzare - in realtà ha una sola condizione: Controllato . Altrimenti, potrebbe essere qualsiasi cosa.

Quando il campo del database è un valore booleano nullable ( bool?), la UX dovrebbe utilizzare 3 pulsanti di opzione, dove il primo pulsante rappresenta "Selezionato", il secondo pulsante rappresenta "Non selezionato" e il terzo pulsante rappresenta il tuo null, qualunque sia la semantica di null significa. È possibile utilizzare un <select><option>elenco a discesa per salvare gli immobili, ma l'utente deve fare clic due volte e le scelte non sono così chiare all'istante.

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

Il RadioButtonList, definito come un'estensione denominata RadioButtonForSelectList, costruisce i pulsanti di opzione per te, incluso il valore selezionato / verificato, e imposta il in <div class="RBxxxx">modo che tu possa usare css per rendere i tuoi pulsanti di opzione orizzontali (display: inline-block), verticale o in modo da tavolo (display: inline-block; larghezza: 100px;)

Nel modello (sto usando string, string per la definizione del dizionario come esempio pedagogico. Puoi usare 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());
}
}

Per me la soluzione era cambiare il modello di visualizzazione. Considera che stai cercando le fatture. Queste fatture possono essere pagate o meno. Quindi la tua ricerca ha tre opzioni: Pagato, Non pagato o "Non mi interessa".

Avevo originariamente impostato come bool? campo:

public bool? PaidInvoices { get; set; }

Questo mi ha fatto inciampare in questa domanda. Ho finito per creare un tipo Enum e l'ho gestito come segue:

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

Ovviamente li avevo avvolti in etichette e avevo il testo specificato, voglio solo dire che ecco un'altra opzione da considerare.

La casella di controllo ti offre solo 2 valori (vero, falso). Nullable booleano ha 3 valori (true, false, null) quindi è impossibile farlo con una casella di controllo.

Una buona opzione è invece utilizzare un menu a discesa.

Modello

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

Controller

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

Visualizza

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

In realtà creerei un modello per questo e lo userei con un EditorFor ().

Ecco come l'ho fatto:

1. Crea il mio modello, che è fondamentalmente una vista parziale che ho creato nella directory EditorTemplates, sotto Condiviso, sotto Viste chiamalo come (ad esempio) 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. Usalo in questo modo (in qualsiasi vista):

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

È tutto.

I modelli sono così potenti in MVC, usali .. Puoi creare un'intera pagina come modello, che useresti con il @Html.EditorFor(); a condizione di passare il suo modello di visualizzazione nell'espressione lambda ..

L'approccio più pulito che potrei trovare è espandere le estensioni disponibili HtmlHelperriutilizzando ancora le funzionalità fornite dal framework.

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

Ho provato a "modellare" l'espressione per consentire un passaggio diretto al nativo, CheckBoxFor<Expression<Func<T, bool>>>ma non credo sia possibile.

Ho avuto un problema simile in passato.

Crea un input per la casella di controllo in HTML e imposta l'attributo name = "Foo" Questo dovrebbe comunque essere pubblicato correttamente.

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

Controlla semplicemente il valore null e restituisci false:

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

Ho anche affrontato lo stesso problema. Ho provato il seguente approccio per risolvere il problema perché non voglio cambiare il DB e generare nuovamente EDMX.

@{

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

 }

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

Quando si crea un EditorTemplate per un modello che contiene un valore bool nullable ...

• Dividi il valore bool nullable in 2 booleani:

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

• All'interno del modello dell'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)
  }

• Non eseguire il postback della proprietà originale Foo, perché ora viene calcolata da FooIsNull e FooCheckbox.

Tutte le risposte sopra sono arrivate con i propri problemi. Il modo più semplice / pulito IMO è creare un aiutante

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

Utilizzo

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

Nel mio scenario, una casella di controllo nullable significa che un membro del personale non ha ancora posto la domanda al cliente, quindi è racchiusa in un in .checkbox-nullablemodo che tu possa modellare in modo appropriato e aiutare l'utente finale a identificare che non è né truenéfalse

CSS

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

Metodi di estensione:

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

I pulsanti di opzione sono utili, ma non consentono di deselezionare . Se desideri questo comportamento, considera l'utilizzo di un menu a discesa / selezione. Il codice seguente genererà il SelectListe questo si associa correttamente a un valore booleano 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)

puoi provare in questo modo

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

Questa è una vecchia domanda e le risposte esistenti descrivono la maggior parte delle alternative. Ma c'è una semplice opzione, se hai bool? nel tuo viewmodel e non ti interessa nulla nella tua interfaccia utente:

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