How do I Save the user response from the C# Code and prevent multiple selection of Radio Button

Question

I have this code snippet here that works, I am writing an ASP.NET MVC application. below is the HTML and the Code behind. I need help on how to allow only one radio button to be selected at a time for each question and secondly how to save the User response.

View

@using (Html.BeginForm("Save", "Home", FormMethod.Post))
{ 
    <div class="jumbotron">
        @for (int i = 0; i < Model.Count(); i++)
        {
            var inputTypes = Model[i].InputTypes.Split(',').ToList();

            <p>@Model[i].Details</p>

            for (int j = 0; j < Model[i].Options.Count; j++)
            {
                for (int x = 0; x < inputTypes.Count; x++)
                {
                    if (inputTypes[x] == "TextBox")
                    {
                        @Html.TextBoxFor(u => Model[i].Options[j].Details, new { @class = "form" })
                    }
                    else if (inputTypes[x] == "CheckBox")
                    {
                        @Html.CheckBoxFor(u => Model[i].Options[j].Details, new { @class = "form" })
                    }
                    else if (inputTypes[x] == "RadioButton")
                    {
                        @Html.RadioButtonFor(u => Model[i].Options[j].Details, new { @class = "form" })
                    }
                }
            }
        }
    </div>
}

Controller

public ActionResult Index()
{
    var questions = _context.Questions.ToList();

    var questionModel = new List<Question>();

    questions.ForEach(q =>
    {
        var model = new Question
        {
            Id = q.Id,
            Title = q.Title,
            Details = q.Details,
            HasMultiAnswers = q.HasMultiAnswers,
            NumberOfAnswers = q.NumberOfAnswers,
            InputTypes = q.InputTypes, //New Line 
            Options = _context.Options.Where(f => f.point == 10).ToList()
        };
        questionModel.Add(model);
    });
    return View(questionModel);
}

MODEL

    public class Question
    {
    public long Id { get; set; }
    public string Title { get; set; }
    public string Details { get; set; } 
    public bool HasMultiAnswers { get; set; }
    public int NumberOfAnswers { get; set; }
    public double TotalPoint { get; set; } 
    public String InputTypes { get; set; } 
    public System.Collections.Generic.List<Option> Options { get; set; }
  }

  public class Option
  {
    public int Id { get; set; }
    public int Order { get; set; }
    public string Details { get; set; } 
    public double point { get; set; } 
  }

UPDATE: The Model has been Updated For the Code.

--- After Responses, I have updated the Code

    @model List<Demo.Controllers.HomeController.MModel>

@using (Html.BeginForm("Save", "Home", FormMethod.Post))
{
    <div class="jumbotron">
        @for (int i = 0; i < Model.Count(); i++)
        {
            var inputTypes = Model[i].InputTypes.Split(',').ToList();
            <p> @Model[i].Details</p>

            for (int j = 0; j < Model[i].Options.Count; j++)
            {
                for (int x = 0; x < inputTypes.Count; x++)
                {
                    if (inputTypes[x] == "TextBox")
                    {
                        @Html.TextBoxFor(u => Model[i].Options[j].Name, new { @class = "form-control" })
                        <br />
                    }
                    else if (inputTypes[x] == "CheckBox")
                    {
                        @Html.CheckBoxFor(u => Model[i].Options[j].IsBoolean.Value, new { @class = "form-control", @checked = "false" })
                        <br />
                    }
                    else if (inputTypes[x] == "RadioButton")
                    {
                        @Html.RadioButtonFor(u => Model[i].Options[j].IsBoolean, "false", new { @class = "form-control" })
                        <br />
                    }
                    else if (inputTypes[x] == "Multiple")
                    {
                        @Html.CheckBoxFor(u => Model[i].Options[j].IsBoolean.Value, new { @class = "form-control", @value = "false" })
                        <br />
                        @Html.TextBoxFor(u => Model[i].Options[j].Name, new { @class = "form-control" })
                        <br />
                    }
                }
            }
        }
    </div>
}


public ActionResult Index()
    {
        var questions = _context.aQuestions.ToList();

        var questionModel = new List<MModel>();

        questions.ForEach(q =>
        {
            var model = new MModel
            {
                QuestionID = q.QuestionID,
                Title = q.Title,
                Details = q.Details,
                HasMultiAnswers = q.HasMultiAnswers,
                NumberOfAnswers = q.NumberOfAnswers,
                InputTypes = q.InputTypes, //New Line 
                Options = _context.aOptions.Where(f => f.QuestionID == q.QuestionID).ToList()
            };
            questionModel.Add(model);
        });
        return View(questionModel);
    }
    public class MModel
    {
        public short QuestionID { get; set; }
        public string Title { get; set; }
        public string Details { get; set; }
        public Nullable<bool> HasMultiAnswers { get; set; }
        public Nullable<byte> NumberOfAnswers { get; set; }
        public string InputTypes { get; set; }
        public System.Collections.Generic.List<aOption> Options { get; set; }
    }

You can stop multiple selections in a group of radio buttons if they all have the same "name" attribute (which you'll need anyway if the values are going to be submitted back to the server correctly). You can google that fact very easily.... — ADyson, Oct 30 '18 at 22:02
Your models are not really making sense. Your `Question` class needs to property to bind to (not the `Options` class), and then you create a radio button for each option, but its not clear what property of `Option` you want to bind to — , Oct 30 '18 at 22:05
Suggest you look at [ASP.NET MVC 5 group of radio buttons](https://stackoverflow.com/questions/28055287/asp-net-mvc-5-group-of-radio-buttons/28057533#28057533) to understand how the models and view code should be structured — , Oct 30 '18 at 22:07
And trying to bind a checkbox to the same property as the textbox or radio buttons also makes no sense (`CheckBoxFor()` is for binding to a `bool` property) - you would ideally have 3 separate properties to bind the selected answer to, or 3 separate Question models (e.g. `YesNoQuestion`, MultipleChoiceQuestion` etc) — , Oct 30 '18 at 22:11
@StephenMuecke I have updated Code again with Boolean for CheckBox — Salem Kosemani, Oct 30 '18 at 22:24
But your models are still not correct - you need properties in the `MModel` to bind the selected answer to, and for the radio buttons, you then create a radio button for each option — , Oct 30 '18 at 22:30

score 0 · Answer 1 · answered Oct 30 '18 at 23:19

Radio buttons are usually used to return on selection out of multiple value list. To allow only one radio button to be selected, you have to bind the Radio Button group to a single model property. Example:

@Html.RadioButtonFor(x => x.Answer, new { value = "a" })
@Html.RadioButtonFor(x => x.Answer, new { value = "b" })
@Html.RadioButtonFor(x => x.Answer, new { value = "c" })

where x represents the model which have the Answer property in this example. Now based on the user selection, Answer value will set to either a, b, or c

How do I Save the user response from the C# Code and prevent multiple selection of Radio Button

1 Answers1