Get selected radiobutton values in MVC

Question

I have below Model structure

public class Quiz
{
    public List<Question> Questions { get; set; }
}

public class Question
{
    public int Id { get; set; }
    public String QuestionText { get; set; }
    public List<Option> Options { get; set; }
    public int AnswerId { get; set; }
}

public class Option
{
    public int Id { get; set; }
    public String OptionText { get; set; }
    public int DisplayOrder { get; set; }
}

And my view is like below where I am displaying all the questions and options

foreach (var question in Model.Questions)
{
    @Html.DisplayFor(modelItem => question.QuestionText) <br />
    foreach (var option in question.Options)
    {
        @Html.RadioButton("Id", option.Id)@option.OptionText
    }
}
<input type="submit" value="Submit" />

I am not getting the values for all selected radiobuttons, It always returns one value in form collection

[HttpPost]
public ActionResult Quiz(Quiz userResponse, FormCollection form)
{
    foreach (var item in form.AllKeys)
    {
        string value = form[item];
        // save data 
    }
    //var selectedOption = frm["Id"];
    return View();
}

Can you please help?

You cannot use a `foreach` loop for the `Questions` - you need a `for` loop or custom `EditorTemplate`. Refer [this answer](http://stackoverflow.com/questions/28055287/asp-net-mvc-5-group-of-radio-buttons/28057533#28057533) for an example of how to generate the view. And DO NOT use `FormCollection` — , Mar 29 '16 at 23:28
@StephenMuecke You should make this an answer. OP it's probably only returning 1 value in collection because the html markup for the radio buttons are overwriting each other (all the same name and id), that's why you need for loop to distinguish each one. — Martin Dawson, Mar 30 '16 at 00:43
@MartinMazzaDawson, Waste of time trying to help some users :) — , Apr 12 '16 at 02:35

score 2 · Answer 1 · edited May 23 '17 at 11:50

You creating radio buttons that have no relationship to you model and all have the same name="Id" attribute (and you would only ever be able to select one option from all the questions). You need to use a for loop or EditorTemplate for typeof Question (refer this answer for a more detailed explanation). Using an EditorTemplate, your code will be

/Views/Shared/EditorTemplates/Question.cshtml

@model Question
@Html.HiddenFor(m => m.Id)
@Html.DisplayFor(m => m.QuestionText)
@foreach(var option in Model.Options)
{
    <div>
        <label>
            @Html.RadioButtonFor(m => m.AnswerId , option,Id, new { id = "" })
            <span>@option.OptionText</span>
        </label>
    </div>
}

and in the main view

@model Quiz
@using (Html.BeginForm())
{
    @Html.EditorFor(m => m.Questions)
    <input type="submit" value="Save" />
}

and the controller method

[HttpPost]
public ActionResult Quiz(Quiz model)

The model in the POST method will be bound with each question containing its Id and AnswerId (the Id of the selected Option) properties.

Side note: Your current POST method has return View() but this would fail because the value of each Options property will be null. If you need to return the view (which should only be necessary if ModelState is invalid), then you need to repopulate those collections.

Get selected radiobutton values in MVC

1 Answers1