How to Set RadioButtonFor() in ASp.net MVC 2 as Checked by default

Question

How can i Set RadioButtonFor() as Checked By Default

<%=Html.RadioButtonFor(m => m.Gender,"Male")%>

there is way out for (Html.RadioButton) but not for (Html.RadioButtonFor)

any Ideas?

Bartholomew

Is there no option for By default Check when using RadioButtonFor() – Bartholomew

Answer 1

This question on StackOverflow deals with RadioButtonListFor and the answer addresses your question too. You can set the selected property in the RadioButtonListViewModel.

Inadvertency

Answer 2

Use the simple way:

<%= Html.RadioButtonFor(m => m.Gender, "Male", new { Checked = "checked" })%>

Pinup

Thanks! Can also be new { @checked = "checked" }. – Messick

Can I bind Checked property here to Boolean property of a model? such that when i click on it the boolean property turns to true and i can bind that true value to a action method? – Chauffer

Answer 3

It's not too pretty, but if you have to implement only very few radio buttons for the entire site, something like this might also be an option:

<%=Html.RadioButtonFor(m => m.Gender,"Male",Model.Gender=="Male" ? new { @checked = "checked" } : null)%>

Reprobate

Answer 4

I assume you should have a group of radio buttons. something could be like

<%=Html.RadioButtonFor(m => m.Gender,"Male")%>
<%=Html.RadioButtonFor(m => m.Gender,"Female")%>
<%=Html.RadioButtonFor(m => m.Gender,"Unknown")%>

You may give the default value for m.Gender = "Unknown" (or something) from your controller.

Chalaza

But i want only two radiobutton with one of them checked bydefault using Html.RadiobuttonFor() – Bartholomew

I struggled with this as well, but found this answer is so simple. If you create a property on your model, let's say Gender, in your model's default constructor, just set that property to the default gender, like Gender = "Male";. If you do this, mvc.net will automatically select the default and on postback will automatically bind the selected value to your Gender property. – Boutte

Answer 5

This Helper evaluates the expression and if equals to the value it checks the radio button, and has the same parameters than RadioButtonFor (for this reason the name is diferent):

public static MvcHtmlString CheckedRadioButtonFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression, object value)
{
    return CheckedRadioButtonFor(htmlHelper, expression, value, null);
}

public static MvcHtmlString CheckedRadioButtonFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression, object value, object htmlAttributes)
{
    var func = expression.Compile();
    var attributes = new RouteValueDictionary(htmlAttributes);
    if ((object)func(htmlHelper.ViewData.Model) == value) {
        attributes["checked"] = "checked";
    }
    return htmlHelper.RadioButtonFor(expression, value, attributes);
}

Usage:

<%= Html.CheckedRadioButtonFor(m => m.Gender, "Male", new { id = "gender-male" })%>

Result:

<!-- For Model.Gender = "Male" -->
<input checked="checked" id="gender-male" name="Gender" type="radio" value="Male">
<!-- For Model.Gender = "Female" -->
<input id="gender-male" name="Gender" type="radio" value="Male">

Bilestone

You should use the HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes); instead of the new RouteValueDictionary(htmlAttributes) in order to not lose the automatic convertsion of the data_something to data-something – Harriot

Answer 6

I found another option so you can just use @Html.EditorFor() with templates:

Say I have this enum:

public enum EmailType { Pdf, Html }

I can put this code in Views/Shared/EditorTemplates/EmailType.cshtml

@model EmailType
@{
    var htmlOptions = Model == EmailType.Html ? new { @checked = "checked" } : null;
    var pdfOptions = Model == EmailType.Pdf ? new { @checked = "checked" } : null;
}

@Html.RadioButtonFor(x => x, EmailType.Html, htmlOptions) @EmailType.Html.ToString()
@Html.RadioButtonFor(x => x, EmailType.Pdf, pdfOptions) @EmailType.Pdf.ToString()

Now I can simply use this if I want to use it at any time:

@Html.EditorFor(x => x.EmailType)

It's much more universal this way, and easier to change I feel.

Juliannajulianne

Answer 7

Came across this and thought I would point out that for MVC 5 all you need to do is set the value on the model. For Example:

Model:

   public class ExampleModel
    {
        public PackingListInputModel()
        {

             RadioButtonField = "One";

        }
        public string RadioButtonField { get; set; }
    }

View :

@model ExampleModel

@using (Html.BeginForm)
{
    @Html.RadioButtonFor(m => m.RadioButtonField , "One")
    @Html.RadioButtonFor(m => m.RadioButtonField , "Two")
}

The state of the first radio button ("One") will be set as active because the value matches what was set in the model.

Mclaurin

Answer 8

You can also add labels that are tied to your radio buttons with the same ID, which then allows the user to click the radio button or label to select that item. I'm using constants here for "Male", "Female" and "Unknown", but obviously these could be strings in your model.

<%: Html.RadioButtonFor(m => m.Gender, "Male", 
    new Dictionary<string, object> { { "checked", "checked" }, { "id", "Male" } }) %>
<%: Html.Label("Male") %>

<%: Html.RadioButtonFor(m => m.Gender, "Female", 
    new Dictionary<string, object> { { "id", "Female" } }) %>
<%: Html.Label("Female")%>

<%: Html.RadioButtonFor(m => m.Gender, "Unknown",
    new Dictionary<string, object> { { "id", "Unknown" } }) %>
<%: Html.Label("Unknown")%>

Sardanapalus

Thanks! was having difficulty in creating the label for the checkbox. Quite obvious now, but could not figure out! – Remonaremonetize

Answer 9

<%: Html.RadioButtonFor(m => m.Gender, "Male", new { @checked = true } )%>

or

@checked = checked

if you like

Warrick

Answer 10

If you're using jquery, you can call this right before your radio buttons.

$('input:radio:first').attr('checked', true);

^ This will check the first radio box, but you can look at more jquery to cycle through to the one you want selected.

Fy

Answer 11

           @Html.RadioButton("Insured.GenderType", 1, (Model.Insured.GenderType == 1 ))
           @Web.Mvc.Claims.Resources.PartyResource.MaleLabel
           @Html.RadioButton("Insured.GenderType", 2, Model.Insured.GenderType == 2)
           @Web.Mvc.Claims.Resources.PartyResource.FemaleLabel

Axolotl

Answer 12

Here is code to set default radio button set to true

@Html.RadioButtonFor(m => m.Gender, "Male", new { @checked = "checked", id = "rdGender", name = "rbGender" })

Teletypewriter

Answer 13

I find it best to just put the default value in the constructor method of the model.

Gender = "Male";

Father

Answer 14

You need to add 'checked' htmlAttribute in RadioButtonFor, if the radiobutton's value matches with Model.Gender value.

@{
        foreach (var item in Model.GenderList)
        {
            <div class="btn-group" role="group">
               <label class="btn btn-default">
                   @Html.RadioButtonFor(m => m.Gender, item.Key, (int)Model.Gender==item.Key ? new { @checked = "checked" } : null)
                   @item.Value
              </label>
            </div>
        }
    }

For complete code see below link: To render bootstrap radio button group with default checked. stackoverflow answer link

Arlberg