title: Update database Tables based on list of Checkbox selection in MVC Edit View
body: <p>I am new to MVC. I have a Edit view which has some fields related to Page Menu like Name, Url etc. In the same view i have List of page roles(Admin, Customer etc) displayed as Checkboxes. In the Edit Get Request, some checkboxes are displayed selected based on the database values for that particular Page Menu.</p>
  
  <p>Eg, if Admin and customer are authorized to view that particular page, only Admin and Customer roles checkboxes are displayed selected in the Edit Get Request.</p>
  
  <p>I Have three tables Page, roles and PageRole table connecting the other two tables.</p>
  
  <p>Now if the user edits the Page and Checks/Unchecks checkboxes, i need help on how to save the data back to tables based on the checkbox selection in Edit Post action.</p>
  
  <p><strong>My Edit View Model Class:</strong></p>
  
  <pre><code>        public class PageAdminEditViewModel : PageAdminViewModel
              {              
                  public virtual SelectList PageList { get; set; }      
                  public IList&lt;PageRoleData&gt; PageRoleData { get; set; }                       
              }
  </code></pre>
  
  <p><strong>My Model class for Checkboxes:</strong></p>
  
  <pre><code>    public class PageRoleData
          {
              public string ASPNetRoleID { get; set; }
              public string PageRoleID { get; set; }
              public int PageID { get; set; }
              public string RoleName { get; set; }
              public bool Selected { get; set; }
      }
  </code></pre>
  
  <p><strong>MY EDIT Get Action Method:</strong></p>
  
  <pre><code>    public ActionResult Edit(int id)
              {
                  if (ModelState.IsValid)
                  {
                      try
                      {
                          var pData = m_pas.Get&lt;PageAdminEditViewModel&gt;(id);
  
                          var data = m_pas.GetAll(true);
  
                          SelectList pageList
                              = new SelectList(data,
                                  nameof(PageAdminEditViewModel.Pageid),
                                  nameof(PageAdminEditViewModel.Pagename));
  
                          IList&lt;PageRoleData&gt; pageRoleData = m_pas.GetPageRolesByPageID(id);
  
                          pData.PageList = pageList;          // For Dropdownlist values                    
                          pData.PageRoleData = pageRoleData;  // For Checkboxes values                  
  
                          return View(pData);
                      }
                      catch (Exception ex)
                      {
                          s_log.Fatal($"An error occurred when calling the Edit Page. {ex.Message}", ex);
                      }
                  }
                  return View();
              }
  </code></pre>
  
  <p><strong>My EDIT POST Action:</strong></p>
  
  <pre><code>    [HttpPost]
              public ActionResult Edit(int id, PageAdminEditViewModel editViewModel)
              {
                  try
                  {
                      m_uow.BeginTransaction();                
  
                      m_pas.CreateOrEdit(id, editViewModel);
  
                      m_uow.Commit();
  
                      return RedirectToAction("Index");
                  }
                  catch (Exception ex)
                  {
                      s_log.Fatal($"An error occurred while saving the changes on the Edit Page. {ex.Message}", ex);
                  }
  
                  return View();
              }
  </code></pre>
  
  <p><strong>My Service Layer CreateorEdit() method for Post Request</strong></p>
  
  <pre><code>public void CreateOrEdit(int id, PageAdminEditViewModel viewModel)
          {
  
              Page pageData = null;            
  
              // Checks whether to create a new Page
              if (id &lt;= 0)
              {
                  pageData = new Page();
              }
              else
              {
                  pageData = m_uow.QueryFactory.ObjectQuery.Get&lt;Page, int&gt;(id);                
              }
  
              // Checks if the Page has a Parent Page associated with it
              if (pageData.ParentNodeID != null)
              {
                  // Checks if the user has changed the existing Parent page and assigns the new Parent Page accordingly
                  if (viewModel.ParentNodeID != pageData.ParentNodeID.Pageid)
                  {
                      var newParentPage = m_uow.QueryFactory.ObjectQuery.Get&lt;Page, int&gt;(viewModel.ParentNodeID);
                      pageData.ParentNodeID = newParentPage;
                  }
              }
  
              // In case there is no Parent Page, Checks if the user has set any Parent Page and assigns accordingly
              else if (viewModel.ParentNodeID != 0)
              {
                  var newParentPage = m_uow.QueryFactory.ObjectQuery.Get&lt;Page, int&gt;(viewModel.ParentNodeID);
                  pageData.ParentNodeID = newParentPage;
              }
  
              pageData.Pagename = viewModel.Pagename;
  
              if (viewModel.ParentNodeID != 0)
                  pageData.ParentNodeID.Pageid = viewModel.ParentNodeID;
              else
                  pageData.ParentNodeID = null;
  
              pageData.Url = viewModel.Url;
              pageData.Iconimage = viewModel.Iconimage;
              pageData.Pagevisibility = viewModel.Pagevisibility;
              pageData.Displayorder = viewModel.Displayorder;
  
              var pData = Mapper.Map&lt;Page, PageDto&gt;(pageData);
  
              IList&lt;PageRoleData&gt; selectedRoles = viewModel.PageRoleData;
  
              m_uow.AddOrUpdate(pageData);            
          }
  </code></pre>
  
  <p><strong>My EDIT View:</strong></p>
  
  <pre><code>    @model ISPC.CustomerWebsite.Areas.PageAdministration.ViewModels.PageAdminEditViewModel
  
      @{
          if (Model.Pageid &lt;= 0)
          {
              ViewBag.Title = "Create Page Menu";
          }
          else
          {
              ViewBag.Title = "Edit Page Menu";
          }
      }
  
      @if (Model.Pageid &lt;= 0)
      {
          &lt;h2&gt;Create Page Menu&lt;/h2&gt;
      }
      else
      {
          &lt;h2&gt;Edit Page Menu&lt;/h2&gt;
      }
  
      &lt;br /&gt;
  
      @using (Html.BeginForm())
      {
          @Html.AntiForgeryToken()
          &lt;div class="container-fluid" style="float: left; width: 60%;"&gt;
              &lt;div class="editor-label"&gt;
                  @Html.LabelFor(model =&gt; model.Pagename)
                  &lt;div class="editor-field"&gt;
                      @Html.TextBoxFor(model =&gt; model.Pagename, new { style = "width: 200px" })
                      @Html.ValidationMessageFor(model =&gt; model.Pagename)
                  &lt;/div&gt;
              &lt;/div&gt;&lt;br /&gt;
              &lt;div class="editor-label"&gt;
                  @Html.LabelFor(model =&gt; model.ParentNodeID)
                  &lt;div class="editor-field"&gt;
                      @Html.DropDownListFor(model =&gt; model.ParentNodeID, Model.PageList, "-Select-", new { style = "width: 200px" })
                      @Html.ValidationMessageFor(model =&gt; model.Pagename)
                  &lt;/div&gt;
              &lt;/div&gt;&lt;br /&gt;
              &lt;div class="editor-label"&gt;
                  @Html.LabelFor(model =&gt; model.Url)
                  &lt;div class="editor-field"&gt;
                      @Html.TextBoxFor(model =&gt; model.Url, new { style = "width: 200px" })
                      @Html.ValidationMessageFor(model =&gt; model.Url)
                  &lt;/div&gt;
              &lt;/div&gt;&lt;br /&gt;
              &lt;div class="editor-label"&gt;
                  @Html.LabelFor(model =&gt; model.Iconimage)
                  &lt;div class="editor-field"&gt;
                      @Html.TextBoxFor(model =&gt; model.Iconimage, new { style = "width: 200px" })
                      @Html.ValidationMessageFor(model =&gt; model.Iconimage)
                  &lt;/div&gt;
              &lt;/div&gt;&lt;br /&gt;
              &lt;div class="editor-label"&gt;
                  @Html.LabelFor(model =&gt; model.Pagevisibility)
                  &lt;div class="editor-field"&gt;
                      @Html.EditorFor(model =&gt; model.Pagevisibility)
                      @Html.ValidationMessageFor(model =&gt; model.Pagevisibility)
                  &lt;/div&gt;
              &lt;/div&gt;&lt;br /&gt;
              &lt;div class="editor-label"&gt;
                  @Html.LabelFor(model =&gt; model.Displayorder)
                  &lt;div class="editor-field"&gt;
                      @Html.TextBoxFor(model =&gt; model.Displayorder, new { style = "width: 200px" })
                      @Html.ValidationMessageFor(model =&gt; model.Displayorder)
                  &lt;/div&gt;
              &lt;/div&gt;&lt;br /&gt;
              &lt;div&gt;
                  @Html.HiddenFor(model =&gt; model.Pageid)
              &lt;/div&gt;&lt;br /&gt;
  
              &lt;div class="row"&gt;
                  &lt;div&gt;
                      &lt;input type="submit" value="Save" class="btn btn-default" /&gt; |
                      @Html.ActionLink("Back to List", "Index")
                  &lt;/div&gt;
              &lt;/div&gt;        
          &lt;/div&gt;&lt;br /&gt;       
  
          &lt;div class="form-group"&gt;
              &lt;label class="col-md-pull-2 control-label"&gt;
                  Select User Role :
              &lt;/label&gt;&lt;br /&gt;
              &lt;div class="col-md-pull-2"&gt;            
                  @foreach(var item in Model.PageRoleData)
                  {
                      if (item.PageRoleID != null)
                      {
                          item.Selected = true;
                      }
                      else
                      {
                          item.Selected = false;
                      }
  
                      @Html.HiddenFor(model =&gt; item.ASPNetRoleID)
                      @Html.CheckBoxFor(model =&gt; item.Selected, new { @id = "chkbox1", @class = "form-check" })
                      &lt;text&gt;&amp;nbsp;&lt;/text&gt;
  
                      @Html.LabelFor(model =&gt; item.RoleName, item.RoleName)&lt;br /&gt;
                  }
              &lt;/div&gt;
          &lt;/div&gt;
      }
  </code></pre>