binding <input type="radio"> with Model field?

Question

In a view I have two <input type="radio">, combine they make a radio group.

I want to bind them with a field of Model, in a way if value is true it should bind first radio button if false it should bind the other.

Please guide how it can be achived. I tried below code but it always checked the second radio no matter what value model has.

<div class="radiobuttons">
  <input type="radio" name="LenderType" checked="@Model.Filter_Value" id="rbtnAllLenders" class="cb">
  <input type="radio" id="rbtnMajorLendersOnly" checked="[email protected]_Value" name="LenderType" class="cb">
</div>

Answer 1

The input typed as radio needs to have a value set. If the radio is checked, then the value is what is sent for the name in the model.

view model

public class SomeViewModel
{
 public int MyRadioValue { get; set; }
}

input element

<input type="radio" value=1 name="MyRadioValue" />
<input type="radio" value=2 name="MyRadioValue" />
<input type="radio" value=3 name="MyRadioValue" />

Answer 2

You manual code is adding the selected attribute to both radio buttons. All the following are equivalent:

<input type="radio" ... checked />
<input type="radio" ... checked="selected" />
<input type="radio" ... checked="true" />
<input type="radio" ... checked="false" />

Note the last 2 are invalid values for the checked attribute, but still check the radio button. Since you have a group name, and only one button can be visually checked, the last one rendered is selected. Refer W3C specifications.

Use html helpers to bind to your model. If the model contains property string LenderType then

@Html.RadioButtonFor(m => m.LenderType, "All lenders", new { id = "All"})<label for="All">All lenders</label>
@Html.RadioButtonFor(m => m.LenderType, "Major lenders", new { id = "Major"})<label for="Major">Major lenders</label>

If the value of LenderType is "All lenders" the first option will be selected. If the value is "Major lenders", then the second option will be selected

Answer 3

Create Html Helper ....

 public static HtmlString RadioButtonListFor<TModel, TProperty>(this HtmlHelper<TModel> helper, Expression<Func<TModel, TProperty>> expression, IEnumerable<SelectListItem> selectListItems, RadioButtonListLayout layout)
        {
            var sb = new StringBuilder();

            foreach (var item in selectListItems)
            {
                var itemId = string.Format(
                    CultureInfo.InvariantCulture,
                    "{0}_{1}",
                    helper.ViewContext.ViewData.TemplateInfo.GetFullHtmlFieldId(ExpressionHelper.GetExpressionText(expression)),
                    item.Value);

                var itemHtml = string.Format(
                    CultureInfo.InvariantCulture,
                    "{0} <label for=\"{1}\">{2}</label>",
                    helper.RadioButtonFor(expression, item.Value, new { id = itemId }),
                    itemId,
                    item.Text);

                if (layout == RadioButtonListLayout.Horizontal)
                {
                    sb.Append("<span class=\"radiobuttonlist-horizontal\">");
                    sb.Append(itemHtml);
                    sb.AppendLine("</span>");
                }
                else
                {
                    sb.Append("<div class=\"radiobuttonlist-vertical\">");
                    sb.Append(itemHtml);
                    sb.AppendLine("</div>");
                }
            }

            return new HtmlString(sb.ToString());
        }

Use it ...

@Html.RadioButtonListFor(x=>x.Id,Model.ListItem,RadioButtonListLayout.Horizontal)