Checkbox list values are not binding on View GET Request in ASP.NET Core MVC

Question

In my ViewModel I have the following two lists (one is used for showing all available categories in the form and the other is used for just the user selected category values):

public List<CategoryViewModel> Categories{ get; set; }
public List<string> SelectedCategoryValues { get; set; }

In my View I have the following inside of one of my forms:

@foreach (var category in Model.Categories) {
     <div class="checkbox">
          <label><input type="checkbox" name="SelectedCategoryValues" 
          value="@category.Value">@category.Name</label>
     </div>
}

When submitting the form the model binder is correctly binding SelectedCategoryValues list.

However, when loading the page the selected checkboxes are not automatically selecting.

The following code is in my Edit GET Action:

    var vm = new ProductEditViewModel()
    {
        Id = product.Id,
        Name = product.Name,
        Categories = new List<CategoryViewModel>()
        {
            new CategoryViewModel() { Name = "Category 1", Value = "category1" },
            new CategoryViewModel() { Name = "Category 2", Value = "category2" },
            new CategoryViewModel() { Name = "Category 3", Value = "category3" }
        },
        SelectedCategoryValues = productCategories.Select(c => c.Value).ToList()
    };

    return View(vm);

Alex Kudryashev · Accepted Answer · 2017-11-04 19:00:02Z

You need to include something like bool IsSelected{get;set;} into CategoryViewModel and assign values in the controller.

var vm = new ProductEditViewModel()
{
    Id = product.Id,
    Name = product.Name,
    Categories = new List<CategoryViewModel>()
    {
        new CategoryViewModel() { Name = "Category 1", Value = "category1",
         IsSelected = productCategories.Where(c => c.Value == "category1").Count() > 0 ? true : false},
         //do the same
        //new CategoryViewModel() { Name = "Category 2", Value = "category2" },
        //new CategoryViewModel() { Name = "Category 3", Value = "category3" }
    },
    //not required
    //SelectedCategoryValues = productCategories.Select(c => c.Value).ToList()
};

return View(vm);

And in the view

@foreach (var category in Model.Categories) {
     <div class="checkbox">
          <label><input type="checkbox" checked="@category.IsSelected" name="SelectedCategoryValues" 
          value="@category.Value">@category.Name</label>
     </div>
}

Collectives™ on Stack Overflow

Checkbox list values are not binding on View GET Request in ASP.NET Core MVC

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related