Checkbox for nullable boolean

Question

My model has a boolean that has to be nullable  public bool  Foo      get     set      so in my Razor cshtml I have   Html CheckBoxFor m   gt  m Foo    except that doesn t work  Neither does casting it with  bool   If I do   Html CheckBoxFor m   gt  m Foo Value    that doesn t create an error  but it doesn t bind to my model when posted and foo is set to null  Whats the best way to display Foo on the page and make it bind to my model on a post

User · Answer

All the answers above came with it s own issues  Easiest cleanest way IMO is to create a helper  MVC5 Razor  App Code Helpers cshtml   helper CheckBoxFor WebViewPage page  string propertyName  bool  value  string htmlAttributes   null        if  value    null                 lt div class  checkbox-nullable  gt               lt input type  checkbox   page Html Raw htmlAttributes  gt           lt  div gt            else if  value    true                 lt input type  checkbox  value  true   page Html Raw htmlAttributes  checked gt            else                lt input type  checkbox  value  false   page Html Raw htmlAttributes  gt            Usage   Helpers CheckBoxFor this   IsPaymentRecordOk   Model IsPaymentRecordOk    In my scenario  a nullable checkbox means that a staff member had not yet asked the question to the client  so it s wrapped in a  checkbox-nullable so that you may style appropriately and help the end-user identify that it is neither true nor false  CSS   checkbox-nullable       border  1px solid red      padding  3px      display  inline-block

User · Answer

Just check for the null value and return false to it      bool nullableValue     Model nullableValue    null      Model nullableValue    false     false   true     Html CheckBoxFor model   gt  nullableValue

User · Answer

My model has a boolean that has to be nullable   Why  This doesn t make sense  A checkbox has two states  checked unchecked  or True False if you will  There is no third state    Or wait you are using your domain models in your views instead of view models  That s your problem  So the solution for me is to use a view model in which you will define a simple boolean property   public class MyViewModel       public bool Foo   get  set        and now you will have your controller action pass this view model to the view and generate the proper checkbox

User · Answer

I would actually create a template for it and use that template with an EditorFor     Here is how I did it    Create My template  which is basically a partial view I created in the EditorTemplates directory  under Shared  under Views name it as  for example   CheckboxTemplate     using System Globalization      using System Web Mvc Html      model bool          bool  myModel   false      if  Model HasValue                myModel   Model Value            lt input type  checkbox  checked    myModel   name   ViewData TemplateInfo HtmlFieldPrefix  value  True  style  width 20px     gt   Use it like this  in any view      Html EditorFor x    x MyNullableBooleanCheckboxToBe   CheckboxTemplate     Thats all   Templates are so powerful in MVC  use them   You can create an entire page as a template  which you would use with the  Html EditorFor    provided that you pass its view model in the lambda expression

User · Answer

Extension methods           public static MvcHtmlString CheckBoxFor lt TModel gt  this HtmlHelper lt TModel gt  htmlHelper  Expression lt Func lt TModel  bool  gt  gt  expression                        return htmlHelper CheckBoxFor lt TModel gt  expression  null                     public static MvcHtmlString CheckBoxFor lt TModel gt  this HtmlHelper lt TModel gt  htmlHelper  Expression lt Func lt TModel  bool  gt  gt  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

User · Answer

I got it to work with  Html EditorFor model   gt  model Foo    and then making a file at Views Shared EditorTemplates Boolean cshtml with the following   model bool    Html CheckBox  quot  quot   Model GetValueOrDefault

User · Answer

bool testVar     bool item testVar   true   false        Html DisplayFor modelItem   gt  testVar

User · Answer

This is an old question  and the existing answers describe most of the alternatives  But there s one simple option  if you have bool  in your viewmodel  and you don t care about null in your UI    Html CheckBoxFor m   gt  m boolValue    false

User · Answer

I have bool  IsDisabled   get  set    in Model  Inserted if in View    lt div class  inputClass  id  disabled  gt       lt div gt       if Model IsDisabled  null                Model IsDisabled   false                        Html CheckBoxFor model   gt  model IsDisabled Value                lt  div gt   lt  div gt

User · Answer

I had a similar issue in the past    Create a Checkbox input in HTML  and set the attribute name  Foo  This should still post properly     lt input type  checkbox  name  Foo  checked   model Foo Value    gt  Foo Checkbox lt br   gt

User · Answer

For me the solution was to change the view model  Consider you are searching for invoices  These invoices can be paid or not  So your search has three options  Paid  Unpaid  or  I don t Care    I had this originally set as a bool  field   public bool  PaidInvoices   get  set      This made me stumble onto this question   I ended up created an Enum type and I handled this as follows    Html RadioButtonFor m   gt  m PaidInvoices  PaidStatus NotSpecified  new    checked   true     Html RadioButtonFor m   gt  m PaidInvoices  PaidStatus Yes    Html RadioButtonFor m   gt  m PaidInvoices  PaidStatus No    Of course I had them wrapped in labels and had text specified  I just mean here s another option to consider

User · Answer

Checkbox only offer you 2 values  true  false   Nullable boolean has 3 values  true  false  null  so it s impossible to do it with a checkbox   A good option is to use a drop down instead   Model  public bool  myValue  public List lt SelectListItem gt  valueList    Controller  model valueList   new List lt SelectListItem gt     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        View   Html DropDownListFor m   gt  m myValue  valueList

User · Answer

The cleanest approach I could come up with is to expand the extensions available to HtmlHelper while still reusing functionality provided by the framework   public static MvcHtmlString CheckBoxFor lt T gt  this HtmlHelper lt T gt  htmlHelper  Expression lt Func lt T  bool  gt  gt  expression  IDictionary lt string  object gt  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       I experimented with  shaping  the expression to allow a straight pass through to the native CheckBoxFor lt Expression lt Func lt T  bool gt  gt  gt  but I don t think it s possible

User · Answer

Radio buttons are useful  but they don t allow you to deselect   If you want this behaviour  then consider using a drop-down select   The following code will generate the SelectList and this binds successfully to a nullable boolean   public static SelectList GetBoolTriState         var items   new List lt SelectListItem gt                new SelectListItem  Value       Text                new SelectListItem  Value    True   Text    Yes            new SelectListItem  Value    False   Text    No                return new SelectList items   Value    Text

User · Answer

Found answer in similar question - Rendering Nullable Bool as CheckBox  It s very straightforward and just works    Html CheckBox  RFP DatesFlexible   Model RFP DatesFlexible    false   Html Label  RFP DatesFlexible    My Dates are Flexible     It s like accepted answer from  afinkelstein except we don t need special  editor template

User · Answer

I also faced the same issue  I tried the following approach to solve the issue  because i don t want to change the DB and again generate the EDMX          bool testVar    Model MYVar   true   false         lt label gt  Html CheckBoxFor m   gt  testVar testVar lt  label gt  lt br   gt

User · Answer

When making an EditorTemplate for a model which contains a nullable bool      Split the nullable bool into 2 booleans      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     Within the editor template    Html HiddenFor m   gt  m FooIsNull    if  Model FooIsNull           Null means  checkbox is hidden       Html HiddenFor m   gt  m FooCheckbox    else        Html CheckBoxFor m   gt  m FooCheckbox     Do not postback the original property Foo  because that is now calculated from FooIsNull and FooCheckbox

User · Answer

Complicating a primitive with hidden fields to clarify whether False or Null is not recommended   Checkbox isn t what you should be using -- it really only has one state  Checked  Otherwise  it could be anything    When your database field is a nullable boolean  bool    the UX should use 3-Radio Buttons  where the first button represents your  Checked   the second button represents  Not Checked  and the third button represents your null  whatever the semantics of null means   You could use a  lt select gt  lt option gt  drop down list to save real estate  but the user has to click twice and the choices aren t nearly as instantaneously clear     1     0      null  True  False  Not Set Yes   No     Undecided Male  Female Unknown On    Off    Not Detected   The RadioButtonList  defined as an extension named RadioButtonForSelectList  builds the radio buttons for you  including the selected checked value  and sets the  lt div class  RBxxxx  gt  so you can use css to make your radio buttons go horizontal  display  inline-block   vertical  or in a table fashion  display  inline-block  width 100px    In the model  I m using string  string for the dictionary definition as a pedagogical example  You can use bool   string   public IEnumerable lt SelectListItem gt  Sexsli   get  set           SexDict   new Dictionary lt string  string gt                                 M    Male                       F    Female                        U    Undecided                            Convert the Dictionary Type into a SelectListItem Type         Sexsli   SexDict Select k   gt                new SelectListItem                                   Selected    k Key     U                      Text   k Value                    Value   k Key ToString                       lt fieldset id  Gender  gt   lt legend id  GenderLegend  title  Gender - Sex  gt I am a lt  legend gt       Html RadioButtonForSelectList m   gt  m Sexsli  Model Sexsli   Sex             Html ValidationMessageFor m   gt  m Sexsli   lt  fieldset gt   public static class HtmlExtensions   public static MvcHtmlString RadioButtonForSelectList lt TModel  TProperty gt       this HtmlHelper lt TModel gt  htmlHelper      Expression lt Func lt TModel  TProperty gt  gt  expression      IEnumerable lt SelectListItem gt  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   lt input data-val  true  data-val-required  You must select an option  id  RB 1  name  RB  type  radio  value  1    gt  lt label for  RB 1  gt Choice 1 lt  label gt            sb AppendFormat   lt div class   RB 2    gt  0  1  lt  div gt    radio  label  rbClassName            return MvcHtmlString Create sb ToString

[asp.net-mvc-3] Checkbox for nullable boolean

Examples related to asp.net-mvc-3

Examples related to razor

Examples related to nullable