how to set radio button checked in edit mode in MVC razor view - asp.net-mvc-4

Question

I am new in MVC razor. I am trying to edit the web page. In which I have two radio buttons. I am successful in save data for radio button values. But when I trying to edit that value I am not able to select that radio button for which data is saved.
I have enum for Gender
public enum Gender
{
Male,
Female
}
My create code is :-
<div class="editor-label">
#Html.LabelFor(model => model.gender)
</div>
<div class="editor-field">
#Html.RadioButtonFor(x => x.gender, (int)Gender.Male) Male
#Html.RadioButtonFor(x => x.gender, (int)Gender.Female) Female
</div>
Edit code is like
<div class="editor-label">
#Html.LabelFor(model => model.gender)
</div>
<div>
#if (Model.gender == (int)Gender.Male)
{
#Html.RadioButtonFor(model => model.gender, "Male", new { #checked = true })
#Html.Label("Male")
#Html.RadioButtonFor(model => model.gender, "Female")
#Html.Label("Female")
}
else
{
#Html.RadioButtonFor(model => model.gender, "Male")
#Html.Label("Male")
#Html.RadioButtonFor(model => model.gender, "Female", new { #checked = true })
#Html.Label("Female")
}
</div>

Answer 1

You have written like
#Html.RadioButtonFor(model => model.gender, "Male", new { #checked = true }) and
#Html.RadioButtonFor(model => model.gender, "Female", new { #checked = true })
Here you have taken gender as a Enum type and you have written the value for the radio button as a string type- change "Male" to 0 and "Female" to 1.

Answer 2

Don't do this at the view level. Just set the default value to the property in your view model's constructor. Clean and simple. In your post-backs, your selected value will automatically populate the correct selection.
For example
public class MyViewModel
{
public MyViewModel()
{
Gender = "Male";
}
}
<table>
<tr>
<td><label>#Html.RadioButtonFor(i => i.Gender, "Male")Male</label></td>
<td><label>#Html.RadioButtonFor(i => i.Gender, "Female")Female</label></td>
</tr>
</table>

Answer 3

Here is the code for get value of checked radio button and set radio button checked according to it's value in edit form:
Controller:
[HttpPost]
public ActionResult Create(FormCollection collection)
{
try
{
CommonServiceReference.tbl_user user = new CommonServiceReference.tbl_user();
user.user_gender = collection["rdbtnGender"];
return RedirectToAction("Index");
}
catch(Exception e)
{
throw e;
}
}
public ActionResult Edit(int id)
{
CommonServiceReference.ViewUserGroup user = clientObj.getUserById(id);
ViewBag.UserObj = user;
return View();
}
VIEW:
Create:
<input type="radio" id="rdbtnGender1" name="rdbtnGender" value="Male" required>
<label for="rdbtnGender1">MALE</label>
<input type="radio" id="rdbtnGender2" name="rdbtnGender" value="Female" required>
<label for="rdbtnGender2">FEMALE</label>
Edit:
<input type="radio" id="rdbtnGender1" name="rdbtnGender" value="Male" #(ViewBag.UserObj.user_gender == "Male" ? "checked='true'" : "") required>
<label for="rdbtnGender1">MALE</label>
<input type="radio" id="rdbtnGender2" name="rdbtnGender" value="Female" #(ViewBag.UserObj.user_gender == "Female" ? "checked='true'" : "") required>
<label for="rdbtnGender2">FEMALE</label>

Answer 4

Here is how I do it and works both for create and edit:
//How to do it with enums
<div class="editor-field">
#Html.RadioButtonFor(x => x.gender, (int)Gender.Male) Male
#Html.RadioButtonFor(x => x.gender, (int)Gender.Female) Female
</div>
//And with Booleans
<div class="editor-field">
#Html.RadioButtonFor(x => x.IsMale, true) Male
#Html.RadioButtonFor(x => x.IsMale, false) Female
</div>
the provided values (true and false) are the values that the engine will render as the values for the html element i.e.:
<input id="IsMale" type="radio" name="IsMale" value="True">
<input id="IsMale" type="radio" name="IsMale" value="False">
And the checked property is dependent on the Model.IsMale value.
Razor engine seems to internally match the set radio button value to your model value, if a proper from and to string convert exists for it.
So there is no need to add it as an html attribute in the helper method.

Answer 5

To set radio button checked in edit mode in MVC razor view, please trying as follow:
<div class="col-lg-11 col-md-11">
#Html.RadioButtonFor(m => m.Role, "1", Model.Role == 1 ? "checked" : string.Empty)
<span>Admin</span>
#Html.RadioButtonFor(m => m.Role, "0", Model.Role == 0 ? "checked" : string.Empty)
<span>User</span>
#Html.HiddenFor(m => m.Role)
</div>
Hope it help!

Answer 6

Add checked to both of your radio button. And then show/hide your desired one on document ready.
<div class="form-group">
<div class="mt-radio-inline" style="padding-left:15px;">
<label class="mt-radio mt-radio-outline">
Full Edition
<input type="radio" value="#((int)SelectEditionTypeEnum.FullEdition)" asp-for="SelectEditionType" checked>
<span></span>
</label>
<label class="mt-radio mt-radio-outline">
Select Modules
<input type="radio" value="#((int)SelectEditionTypeEnum.CustomEdition)" asp-for="SelectEditionType" checked>
<span></span>
</label>
</div>
</div>

Answer 7

In my case the #checked = "checked" attribute did not work because I was loading default values from the model, which were not equal with the RadioButton value.
Once I changed the loaded values from the model to be equal to the radiobutton value, the button was checked.
For example this will make the radiobutton to be checked by default:
In the model:
response.data = "data"
In the view:
#Html.RadioButtonFor(m => m.data, "data",new {#class="form-check-input"})
<label class="form-check-label">Data (default)</label>