Model Binding a checkbox?

Question

I have always used the MVC model binding so this is new for me. I have a class and mvc razor form.

public class Student
{
    public string Id { get; set; }
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public bool? IsNew { get; set; }
}

My mvc razorpage

<div class="form-group">
    <label class="checkbox-inline">
      <input type="checkbox" name="isNew" id="isNew">Import
    </label>
 </div>
 <div class="form-group">
     <label for="firstName">FirstName</label>
     <input class="form-control" name="firstName" id="firstName"/>
  </div>

The way I have binded the firstName was

student.FirstName = request.Form.Get("firstName");

But I have not been able to use the same technique for checkbox? I tried using

       student.IsNew = request.Form.GetValues("isNew");
       student.IsNew = request.Form.Get("isNew");

How can I do this?

If you're using modelbinding, shouldn't you just have a `Student` parameter on your action method? See also: http://stackoverflow.com/questions/12674572/proper-usage-of-net-mvc-html-checkboxfor for better syntax of your razor page — thekip, Dec 09 '15 at 18:03
Your not binding to your property. A checkbox without a value posts back `"on"` which cannot be bound to a `boolean` property. And if the checkbox is unchecked, nothing is posted. Why are you not using model binding? — , Dec 09 '15 at 20:50

score 2 · Answer 1 · answered Dec 10 '15 at 03:17

You should be using MVC Model binding which makes it easier for you.

Model binding reads all the posted data , querystring values etc and build an object for you. Model binding allow your controller code to remain cleanly separated from the dirtiness of interrogating the request and its associated environment.

public ActionResult Create()
{
   var vm = new Student();
   return View(vm);
}
[HttpPost]
public ActionResult Create(Student model)
{
   //You can check model.IsNew and model.FirstName properties here
   // TO DO : Save and Redirect to a success message action method
   // Ex : return RedirectToAction("SavedSuccessfully");
}

And your strongly typed razor view

@model Student
@using (Html.BeginForm())
{
    <lable>FirstName </lable>@Html.TextBoxFor(d=>d.FirstName)
    <lable>FirstName </lable>@Html.TextBoxFor(d => d.LastName)
    <label>New ? </label>@Html.CheckBoxFor(g=>g.IsNew)
    @Html.HiddenFor(d=>d.Id)
    <p>
        <input id="BtnAdd" name="myButton" type="submit" value="Add" />
    </p>
}

I have always used MVC model binding but I am debugging this issue for legacy code. I may have to revert the codes and use MVC model binding instead. — Yuvi, Dec 10 '15 at 10:16

score 1 · Accepted Answer · answered Dec 10 '15 at 10:55

Morning, Just an update on how I managed to solve this: I looked at the values that is coming from the form.

I used this to get model binding work.

       if (!string.IsNullOrEmpty(request.Form.Get("isNew")))
        {
            vehicle.IsNew = true;
        }
        else
        {
            vehicle.IsNew = false;
        }

And for future reference, always use mvc model binders

score 1 · Answer 3 · answered Mar 18 '18 at 23:47

When returning IList and only having to select a few students and pass them to [HttpPost] public ActionResult Student(IFormCollection form, int[] SelectedSID), here is what you can add in your View.

@model IList<MvcDWOL.Data.Student>

@{
    ViewData["Title"] = "Add Students";
}

@Html.Partial("_StatusMessage", @ViewData["StatusMessage"])

<div class="container"">
<div class="top-buffer"></div>
<div class="panel panel-primary" style="border:none">
<div class="panel-heading panel-head">Live</div>
<div class="panel-body">

@using (Html.BeginForm("AddEdit", "Student", FormMethod.Post))
{

        <div class="form-actions no-color">
        <p>
            <input type="submit" value="Save" class="btn btn-primary"/> 
        </p>
       </div>

<table> 
<tbody>
  <thead>
        <tr>
             <th>
                Add (checkbox)
            </th>
            <th>
               Name
            </th>
            <th>
               Type
            </th>
             <th style="display:none">
                  Start Date
                </th>
             <th>
                   Start Time
                </th>
              <th style="display:none">
                  End Date
                </th>
                <th>
                   End Time
                </th>   
        </tr>
    </thead>

   @if (Model.Any())
  { 
        foreach (var item in Model)
        {

                <tr>
                <th  style="display:none">
                <input id="item@(item.ID)" type="hidden" 
                name="SelectedSID"
                value="@item.ID"
                /> 
                </th>
                <th>   
                <div style="zoom:1.5;">
                    @Html.CheckBox("IsAdded",@item.IsAdded)
                 </div> 
                </th>
                <th>

                  @item.Name
                 <input id="item@(item.Name)" type="hidden"  name="Name" value="@item.Name"/>
                </th>
                <th>
                  @item.Type.TypeName
                <input id="item@(item.TypeID)" type="hidden"  name="TypeID" value="@item.TypeID"/> 
                </th>
                <th>
                   @item.StartTimeValue
                 <input id="item@(item.StartTime)" type="hidden"  name="StartTime" value="@item.StartTime"/> 
                 <input id="item@(item.StartTimeValue)" type="hidden"  name="StartTimeValue" value="@item.StartTimeValue"/> 
                </th>
                <th>
                   @item.EndTimeValue
                 <input id="item@(item.EndTime)" type="hidden"  name="EndTime" value="@item.EndTime"/> 
                 <input id="item@(item.EndTimeValue)" type="hidden"  name="EndTimeValue" value="@item.EndTimeValue"/> 
                </th>
            </tr>

         }
   }         
  </tbody>
</table>
        @Html.ValidationSummary()
        <div class="form-actions no-color">
        <p>
            <input type="submit" value="Save" class="btn btn-primary" /> 
        </p>
      </div>

}


</div></div></div>

Model Binding a checkbox?

3 Answers3