Button Switches MVC3 (Razor)

Question

First, I have to create some switches in the mvc3 partial view.

When I am on the screen, I need to select only one radio button and get a certain value.

How can I do this (e.g. using JS or C #)?

<div id="UserDeleteInfosField"> <p> @Html.RadioButton("HasUserLeave", new { id = "rb1" }) @UserAccountResources.UserLeave @Html.HiddenFor(x => x.UserLeave) </p> <br /> <p> @Html.RadioButton("HasUserTransfer", new { id = "rb2" }) @UserAccountResources.UserTransfer @Html.HiddenFor(x => x.UserTransfer) </p> <br /> <p> @Html.RadioButton("HasUserDetachment", new { id = "rb3" }) @UserAccountResources.UserDetachment @Html.HiddenFor(x => x.UserDetachment) </p> <br /> <p> @Html.RadioButton("HasUserRetirement", new { id = "rb4" }) @UserAccountResources.UserRetirement @Html.HiddenFor(x => x.UserRetirement) </p> <br /> <p> @Html.RadioButton("HasUserStatus", new { id = "rb5" }) @UserAccountResources.UserStatus @Html.HiddenFor(x => x.UserStatus) </p> </div> 

Thanks in advance!

Ars_n

Answer 1

See an example to understand how switches are grouped: example

You need the same name attribute as here:

 <input type="radio" name="group2" value="Water" /> Water<br /> <input type="radio" name="group2" value="Beer" /> Beer<br /> <input type="radio" name="group2" value="Wine" checked /> Wine<br /> 

Your example:

 @Html.RadioButton("SameGroup", "rb1") @Html.RadioButton("SameGroup", "rb2") @Html.RadioButton("SameGroup", "rb3") @Html.RadioButton("SameGroup", "rb4") @Html.RadioButton("SameGroup", "rb5") 

Only the verified value that you get as a result of the controller in the message.

Answer 2

So you need a group of ham radio fans? I use a special assistant for this.

Code for helper:

 public static MvcHtmlString RadioButtonForSelectList<TModel, TProperty>( this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression, IEnumerable<SelectListItem> listOfValues) { var metaData = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData); var sb = new StringBuilder(); if (listOfValues != null) { // Create a radio button for each item in the list foreach (SelectListItem item in listOfValues) { // Generate an id to be given to the radio button field var id = string.Format("{0}_{1}", metaData.PropertyName, item.Value); // Create and populate a radio button using the existing html helpers var label = htmlHelper.Label(id, HttpUtility.HtmlEncode(item.Text)); var radio = htmlHelper.RadioButtonFor(expression, item.Value, new { id = id }).ToHtmlString(); if (item.Selected) { radio = htmlHelper.RadioButtonFor(expression, item.Value, new { id = id, @checked = "checked", }).ToHtmlString(); } // Create the html string that will be returned to the client // eg <input data-val="true" data-val-required="You must select an option" id="TestRadio_1" name="TestRadio" type="radio" value="1" /><label for="TestRadio_1">Line1</label> sb.AppendFormat("<div class=\"RadioButton\">{0}{1}</div>", radio, label); } } return MvcHtmlString.Create(sb.ToString()); } 

Now, in your opinion, you can simply use:

 @Html.RadioButtonForSelectList(model => model.yourproperty, Model.listUsedToPopulate) 

Now you can check only one of the radio blocks. The verified value is stored in model.yourproperty.

Answer 3

I assume that you want to place this in the controller method, so maybe this is what you are trying to do:

Suppose the controller method accepts a parameter called myParameter , then you will need to set the name of the switches to the same to group them, and then set the value to everything you need:

 <div id="UserDeleteInfosField"> <p> @Html.RadioButton("myParameter", UserAccountResources.UserLeave) @UserAccountResources.UserLeave @Html.HiddenFor(x => x.UserLeave) </p> <br /> <p> @Html.RadioButton("myParameter", UserAccountResources.UserTransfer) @UserAccountResources.UserTransfer @Html.HiddenFor(x => x.UserTransfer) </p> <br /> <p> @Html.RadioButton("myParameter", UserAccountResources.UserDetachment) @UserAccountResources.UserDetachment @Html.HiddenFor(x => x.UserDetachment) </p> <br /> <p> @Html.RadioButton("myParameter", UserAccountResources.UserRetirement) @UserAccountResources.UserRetirement @Html.HiddenFor(x => x.UserRetirement) </p> <br /> <p> @Html.RadioButton("myParameter", UserAccountResources.UserStatus) @UserAccountResources.UserStatus @Html.HiddenFor(x => x.UserStatus) </p> </div> 

Answer 4

Thank you for your responses.

Finally, I create one group for each switch. And I call the property in the parameter of the rb object.

  <div id="UserDeleteInfosField"> <p> @Html.RadioButton("RbDeleteGroup", Model.UserLeave) @UserAccountResources.UserLeave @Html.HiddenFor(x => x.UserLeave) </p> <br /> <p> @Html.RadioButton("RbDeleteGroup", Model.UserTransfer) @UserAccountResources.UserTransfer @Html.HiddenFor(x => x.UserTransfer) </p> <br /> <p> @Html.RadioButton("RbDeleteGroup", Model.UserDetachment) @UserAccountResources.UserDetachment @Html.HiddenFor(x => x.UserDetachment) </p> <br /> <p> @Html.RadioButton("RbDeleteGroup", Model.UserRetirement) @UserAccountResources.UserRetirement @Html.HiddenFor(x => x.UserRetirement) </p> <br /> <p> @Html.RadioButton("RbDeleteGroup", Model.UserStatus) @UserAccountResources.UserStatus @Html.HiddenFor(x => x.UserStatus) </p> </div> 

Thus, in this case, I can only check one switch at a time and get the property value from the corresponding ViewModel.

  [Display(Name = "UserAccountDeleteInfos", ResourceType = typeof(UserAccountResources))] public string UserLeave { get { return UserAccountResources.UserLeave; } }