Nanu
Nanu

Reputation: 3070

MVC Razor Radio Button

In partial view I work with textboxes like this.

@model Dictionary<string, string>
@Html.TextBox("XYZ", @Model["XYZ"])

How can i generate radiobuttons, and get the desired value in the form collection as YES/NO True/False) ? Currently i am getting null for "ABC" if i select any value for the below.

   <label>@Html.RadioButton("ABC", @Model["ABC"])Yes</label>
   <label>@Html.RadioButton("ABC", @Model["ABC"])No</label>

Controller

        public int Create(int Id, Dictionary<string, string> formValues)
        {
         //Something Something
        }

Upvotes: 70

Views: 235672

Answers (10)

Debendra Dash
Debendra Dash

Reputation: 5646

MVC Razor provides one elegant Html Helper called RadioButton with two parameters (this is general, But we can overload it uptil five parameters) i.e. one with the group name and other being the value

<div class="col-md-10">
    Male:   @Html.RadioButton("Gender", "Male")
    Female: @Html.RadioButton("Gender", "Female")
</div>                         

Upvotes: 6

user5138047
user5138047

Reputation: 39

I wanted to share one way to do the radio button (and entire HTML form) without using the @Html.RadioButtonFor helper, although I think @Html.RadioButtonFor is probably the better and newer way (for one thing, it's strongly typed, so is closely linked to theModelProperty). Nevertheless, here's an old-fashioned, different way you can do it:

    <form asp-action="myActionMethod" method="post">
        <h3>Do you like pizza?</h3>
        <div class="checkbox">
            <label>
                <input asp-for="likesPizza"/> Yes
            </label>
        </div>
    </form>

This code can go in a myView.cshtml file, and also uses classes to get the radio-button (checkbox) formatting.

Upvotes: 0

Prasad De Silva
Prasad De Silva

Reputation: 836

MVC5 Razor Views

Below example will also associate labels with radio buttons (radio button will be selected upon clicking on the relevant label)

// replace "Yes", "No" --> with, true, false if needed
@Html.RadioButtonFor(m => m.Compatible, "Yes", new { id = "compatible" })
@Html.Label("compatible", "Compatible")

@Html.RadioButtonFor(m => m.Compatible, "No", new { id = "notcompatible" })
@Html.Label("notcompatible", "Not Compatible")

Upvotes: 10

Cacho Santa
Cacho Santa

Reputation: 6924

I solve the same problem with this SO answer.

Basically it binds the radio button to a boolean property of a Strongly Typed Model.

@Html.RadioButton("blah", !Model.blah) Yes 
@Html.RadioButton("blah", Model.blah) No 

Hope it helps!

Upvotes: 15

Buhlebesizwe
Buhlebesizwe

Reputation: 31

<p>@Html.RadioButtonFor(x => x.type, "Item1")Item1</p>
<p>@Html.RadioButtonFor(x => x.type, "Item2")Item2</p>
<p>@Html.RadioButtonFor(x => x.type, "Item3")Item3</p>

Upvotes: 3

Anjan Kant
Anjan Kant

Reputation: 4316

I done this in a way like:

  @Html.RadioButtonFor(model => model.Gender, "M", false)@Html.Label("Male")
  @Html.RadioButtonFor(model => model.Gender, "F", false)@Html.Label("Female")

Upvotes: 17

jayson.centeno
jayson.centeno

Reputation: 835

This works for me.

@{ var dic = new Dictionary<string, string>() { { "checked", "" } }; }
@Html.RadioButtonFor(_ => _.BoolProperty, true, (@Model.BoolProperty)? dic: null) Yes
@Html.RadioButtonFor(_ => _.BoolProperty, false, ([email protected])? dic: null) No

Upvotes: 1

Kuqd
Kuqd

Reputation: 497

Simply :

   <label>@Html.RadioButton("ABC", True)Yes</label>
   <label>@Html.RadioButton("ABC", False)No</label>

But you should always use strongly typed model as suggested by cacho.

Upvotes: 25

Nanu
Nanu

Reputation: 3070

<label>@Html.RadioButton("ABC", "YES")Yes</label>
<label>@Html.RadioButton("ABC", "NO")No</label>

Upvotes: 8

Mathew Thompson
Mathew Thompson

Reputation: 56449

In order to do this for multiple items do something like:

foreach (var item in Model)
{
    @Html.RadioButtonFor(m => m.item, "Yes") @:Yes
    @Html.RadioButtonFor(m => m.item, "No") @:No
}

Upvotes: 73

Related Questions