Multiple radio button groups in MVC 4 Razor

Question

I need to have multiple radio button groups in my form like this      I know it s simply done by specifying the same  name  html attribute for each group  HOWEVER MVC doesn t let you specify your own name attribute when using html helper like this    Html RadioButtonFor i   gt  item id  item SelectedID  new   Name   item OptServiceCatId        Because it looks at each tag s  name  attribute  not  id   to map bind the form to the model which the controller receives  etc     Some said that specifying each with the same  GroupName  attribute will solve the problem  but it didn t work either   So  is there any way which works    EDIT  Here s my view  simplified     model Service Provider ViewModels SelectOptServicesForSubServiceViewModel   foreach  var cat in Model OptServices        A piece of code  amp  html here    foreach  var item in cat OptItems Where i   gt  i MultiSelect    false             Html RadioButtonFor i   gt  item id  item SelectedID  new   GroupName   item OptServiceCatId     lt br   gt              NOTE  My model is a List lt OptServices gt    public List lt OptServices gt  Cats  get  set     And OptServices has a List of OptItems inside   public class OptServices     a few things public List lt OptItems gt  Items  get  set

User · Answer

I fixed a similar issue building a RadioButtonFor with pairs of text/value from a SelectList. I used a ViewBag to send the SelectList to the View, but you can use data from model too. My web application is a Blog and I have to build a RadioButton with some types of articles when he is writing a new post.

The code below was simplyfied.

List<SelectListItem> items = new List<SelectListItem>();

Dictionary<string, string> dictionary = new Dictionary<string, string>();

dictionary.Add("Texto", "1");
dictionary.Add("Foto", "2");
dictionary.Add("Vídeo", "3");

foreach (KeyValuePair<string, string> pair in objBLL.GetTiposPost())
{
    items.Add(new SelectListItem() { Text = pair.Key, Value = pair.Value, Selected = false });
}

ViewBag.TiposPost = new SelectList(items, "Value", "Text");

In the View, I used a foreach to build a radiobutton.

<div class="form-group">
    <div class="col-sm-10">
        @foreach (var item in (SelectList)ViewBag.TiposPost)
        {
            @Html.RadioButtonFor(model => model.IDTipoPost, item.Value, false)
            <label class="control-label">@item.Text</label>
        }

    </div>
</div>

Notice that I used RadioButtonFor in order to catch the option value selected by user, in the Controler, after submit the form. I also had to put the item.Text outside the RadioButtonFor in order to show the text options.

Hope it's useful!

User · Answer

all you need is to tie the group to a different item in your model   Html RadioButtonFor x   gt  x Field1   Milk    Html RadioButtonFor x   gt  x Field1   Butter     Html RadioButtonFor x   gt  x Field2   Water    Html RadioButtonFor x   gt  x Field2   Beer

User · Answer

You can use Dictonary to map  Assume Milk Butter Chesse are group A  ListA  Water Beer Wine are group B   Dictonary lt string List lt string gt  gt   dataMap  dataMap add  A  ListA   dataMap add  B  ListB     At View   you can foreach Keys in dataMap and process your action

User · Answer

I was able to use the name attribute that you described in your example for the loop I am working on and it worked  perhaps because I created unique ids   I m still considering whether I should switch to an editor template instead as mentioned in the links in another answer        Html RadioButtonFor modelItem   gt  item Answers AnswerYesNo   true   new  Name   item Description QuestionId  id   string Format  CBY 0    item Description QuestionId   onclick    setDescriptionVisibility this      Yes       Html RadioButtonFor modelItem   gt  item Answers AnswerYesNo   false   new   Name   item Description QuestionId  id   string Format  CBN 0    item Description QuestionId   onclick    setDescriptionVisibility this       No

User · Answer

Ok here s how I fixed this  My model is a list of categories  Each category contains a list of its subcategories  with this in mind  every time in the foreach loop  each RadioButton will have its category s ID  which is unique  as its name attribue  And I also used Html RadioButton instead of Html RadioButtonFor   Here s the final  working  pseudo-code    foreach  var cat in Model Categories        A piece of code  amp  html here    foreach  var item in cat SubCategories            Html RadioButton item CategoryID ToString    item ID              The result is    lt input name  127  type  radio  value  110  gt    Please note that I HAVE NOT put all these radio button groups inside a form  And I don t know if this solution will still work properly in a form   Thanks to all of the people who helped me solve this

[asp.net-mvc-4] Multiple radio button groups in MVC 4 Razor

Examples related to asp.net-mvc-4

Examples related to razor

Examples related to radio-button

Examples related to radio-group