ASP NET MVC Yes No Radio Buttons with Strongly Bound Model MVC

Question

Does anyone know how to bind a Yes No radio button to a boolean property of a Strongly Typed Model in ASP NET MVC   Model  public class MyClass        public bool Blah   get  set        View   lt     Page Title  blah   Inherits  MyClass   gt       lt dd gt           lt    Html RadioButton  blah   Model blah    gt  Yes          lt    Html RadioButton  blah   Model blah    gt  No      lt  dd gt    Thanks  SOLUTION   Thanks for Brian for the direction but it was the opposite of what he wrote  As so -   lt     Page Title  blah   Inherits  MyClass   gt   lt dd gt       lt    Html RadioButton  blah    Model blah    gt  Yes      lt    Html RadioButton  blah   Model blah    gt  No  lt  dd gt

User · Answer

or MVC 2 0    lt    Html RadioButtonFor model   gt  model blah  true    gt  Yes  lt    Html RadioButtonFor model   gt  model blah  false    gt  No

User · Answer

Adding label tags around the radio buttons using regular HTML will fix the  labelfor  issue as well    lt label gt  lt    Html RadioButton  blah    Model blah    gt  Yes lt  label gt   lt label gt  lt    Html RadioButton  blah   Model blah    gt  No lt  label gt    Clicking on the text now selects the appropriate radio button

User · Answer

Here is a more complete example using a fieldset for accessibility reasons and specifying the first button as the default  Without a fieldset  what the radio buttons are for as a whole can not be programmatically determined   Model  public class MyModel       public bool IsMarried   get  set        View   lt fieldset gt       lt legend gt Married lt  legend gt        Html RadioButtonFor e   gt  e IsMarried  true  new   id    married-true          Html Label  married-true    Yes         Html RadioButtonFor e   gt  e IsMarried  false  new   id    married-false          Html Label  married-false    No    lt  fieldset gt    You can add a  checked argument to the anonymous object to set the radio button as the default   new   id    married-true    checked    checked      Note that you can bind to a string by replacing true and false with the string values

User · Answer

I ended up packaging this into an extension method so  1  I could generate the label and radio at once and  2  so I didn t have to fuss with specifying my own IDs   public static class HtmlHelperExtensions       public static MvcHtmlString RadioButtonAndLabelFor lt TModel  TProperty gt  this HtmlHelper lt TModel gt  self  Expression lt Func lt TModel  TProperty gt  gt  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               Usage    Html RadioButtonAndLabelFor m   gt  m IsMarried  true   Yes  I am married

User · Answer

If you re using MVC 3 and Razor you can also use the following    Html RadioButtonFor model   gt  model blah  true  Yes  Html RadioButtonFor model   gt  model blah  false  No

User · Answer

Building slightly off Ben s answer  I added attributes for the ID so I could use labels    lt    Html Label  isBlahYes    Yes    gt  lt    Html RadioButtonFor model   gt  model blah  true  new    id    isBlahYes      gt   lt    Html Label  isBlahNo    No    gt  lt    Html RadioButtonFor model   gt  model blah  false  new    id    isBlahNo      gt    I hope this helps

User · Answer

The second parameter is selected  so use the   to select the no value when the boolean is false    lt    Html RadioButton  blah    Model blah    gt  Yes   lt    Html RadioButton  blah   Model blah    gt  No

User · Answer

If I can throw my hat into the ring  I think there is a cleaner way than the existing answers to reuse the radio button functionality     Let s say you have the following property in your ViewModel   Public Class ViewModel      lt Display Name   Do you like Cats    gt      Public Property LikesCats As Boolean End Class   You can expose that property through a reusable editor template   First  create the file Views Shared EditorTemplates YesNoRadio vbhtml  Then add the following code to YesNoRadio vbhtml    ModelType Boolean    lt fieldset gt       lt legend gt           Html LabelFor Function model  model       lt  legend gt        lt label gt           Html RadioButtonFor Function model  model  True  Yes      lt  label gt       lt label gt           Html RadioButtonFor Function model  model  False  No      lt  label gt   lt  fieldset gt    You can call the editor for the property by manually specifying the template name in your View    Html EditorFor Function model  model LikesCats   YesNoRadio       Pros    Get to write HTML in an HTML editor instead of appending strings in code behind  Preserves the DisplayName DataAnnotation Allows clicks on Label to toggle radio button Least possible code to maintain in form  1 line   If something is wrong with the way it is rending  take it up with the template

[c#] ASP.NET MVC Yes/No Radio Buttons with Strongly Bound Model MVC

Examples related to c#

Examples related to asp.net-mvc

Examples related to model

Examples related to radio-button

Examples related to boolean