ASP.NET MVC RadioButton Update Boolean

asp.net-mvc, c#, radio-button, razor

Solution

Now this inst a straight forward problem. As all your individual `NameViewModel` items need to keep their unique names so the MVC model binder can properly identify and bind your model. (Which I am sure you have guessed).

So now as we no the Name of the radio button controls govern the "group." The name is also used in the HTTP Post to identify the value of the control. So now we are at a catch-22 the Model binder needs the unique names to bind the model on post, and the browser needs the names all the same to function as you have stated.

Now you can use some jQuery voodoo to do this such as binding another `data-` and then bind to the click event of every control with this name. Now I see this more of a hack than a solution but can be done something like. (Yes this is basic)

Assuming this Model

public class PersonViewModel
{
    public PersonViewModel()
    {
        this.Names = new List<NameViewModel>();
    }

    public IList<NameViewModel> Names { get; set; }

}

public class NameViewModel
{
    public NameViewModel()
    {
        this.IsPrimary = false;
    }

    public int ID { get; set; }

    public string FirstName { get; set; }

    public string LastName { get; set; }

    public string MiddleName { get; set; }

    public bool IsPrimary { get; set; }

    public string FullName
    {
        get
        {
            return string.Format("{0}{1} {2}",
                                this.FirstName,
                                !string.IsNullOrWhiteSpace(this.MiddleName) ? " " + this.MiddleName : "",
                                this.LastName);
        }
    }

Markup

@Html.RadioButtonFor(x => x.Names[i].IsPrimary, true, new { data_group = "myGroup" })

Javascript

$(function () {
        $('input[type="radio"][data-group="myGroup"]').click(function () {
            $('input[type="radio"][data-group="myGroup"]').removeAttr('checked');
            $(this).attr('checked', 'checked')
        });
    });

Now this will give you your result as you described. Now an alternative (assume the model above is used) we add another property to the `PersonViewModel` of `PrimaryName` and set this the ID (or Primary Key) of the `NameViewModel`. To make your PersonViewModel look like.

public class PersonViewModel
{
    public PersonViewModel()
    {
        this.Names = new List<NameViewModel>();
    }

    public IList<NameViewModel> Names { get; set; }

    public int PrimaryName { get; set; }
}

And then your markup as.

@Html.RadioButton("PrimaryName", name.ID, name.IsPrimary)
@Html.HiddenFor(x => x.Names[i].ID)

Now this also works but now sets the "PrimaryName" of the PersonViewModel to the ID of the NameViewModel that has been checked. However you your `NameViewModel` will loos the `IsPrimary` value on the Post as we are not passing that value back. To do both you would have to wire up a combination of both options.

Hope this helps you in the correct direction. Either method (or others) should work.

Problem

Original source