View passes an empty model back to controller

Question

I have a problem in ASP.NET. I made a list of checkboxes, and I want to post the selected values back to the controller. Problem is, the model I recieve in my controller is null.

My controller:

[HttpPost]
// POST: /Checklist/index
public ActionResult Index(Zoeken systemencheckboxenss)
{
    var zoekresultaat = _db.VW_Checks.AsQueryable();

    if (systemencheckboxenss.Systemen != null)
    {
        foreach (var item in systemencheckboxenss.Systemen)
        {
            if(item.isSelected == true)
            {
               zoekresultaat = zoekresultaat.Where(sy => (sy.Systeemnaam.Contains(item.Systeemnaam)));
            }
        }
    }

    var systemen = _db.SYSTEEMs;
    //Lijst van systemen en of het geslecteerd is
    var systeemnamen = new List<CheckboxSysteem>();
    //vult de lijst

    foreach (var i in systemen)
    {
        systeemnamen.Add(new CheckboxSysteem
        {
            Systeemnaam = i.SYSTEEMNAAM,
            isSelected = false,
        });
    }

    var models = new Zoeken
    {
        VwChecks = zoekresultaat.ToList(),
        Systemen = systeemnamen,
    }; 

    return View(models);
}

And here is my View:

@model UsabilityChecklistApp.ViewModels.Zoeken

@{
    ViewBag.Title = "Index";
}

<h2>Checks</h2>

@using (Html.BeginForm("Index", "Checklist", Model, FormMethod.Post))
{
    <table class="table">
        @foreach (var item in Model.Systemen)
        {
            <tr>
                <td>
                    @Html.HiddenFor(modelItem => item.Systeemnaam)
                    @Html.HiddenFor(modelItem => item.isSelected)
                    @Html.DisplayFor(modelItem => item.Systeemnaam)
                </td>
                <td>
                    @Html.CheckBoxFor(modelItem => item.isSelected)
                </td>

            </tr>
        }
    </table>
    <input type="submit" value="Zoek" />
}

And ofcourse my ViewModel:

using System.Web;
using UsabilityChecklistApp.Models;

namespace UsabilityChecklistApp.ViewModels
{
    public class Zoeken
    {
        public List<VW_Checks> VwChecks { get; set; }
        public List<CheckboxSysteem> Systemen { get; set; }
    }

    public class CheckboxSysteem
    {
        public string Systeemnaam { get; set; }
        public bool isSelected { get; set; }
    }
}

If I did not provide information to solve the problem, please ask for it.

EDIT: I must use checkboxes, no other options possible

use for loop instead of foreach in View – Ehsan Sajjad Dec 17 '14 at 09:19 — Ehsan Sajjad, Dec 17 '14 at 09:19

score 1 · Accepted Answer · edited May 23 '17 at 10:33

Parameters are routed using their name by default so it is trying to map your model to a parameter named Model. When you're submitting a form things are usually handled for you though so you don't need to worry about the parameter name as the Model Binder will take care of the mapping.

All you need to do is remove the Model parameter from the form so the model binder can take care of it all for you

@using (Html.BeginForm("Index", "Checklist", FormMethod.Post))}

To get the list to map properly you'll need to changed your cshtml like so:

<table class="table">
    @for(int i = 0; i < Model.Systemen.Count; i++)
    {
        <tr>
            <td>
                @Html.HiddenFor(modelItem => modelItem.Systemen[i].Systeemnaam)
                @Html.DisplayFor(modelItem => modelItem.Systemen[i].Systeemnaam)
            </td>
            <td>
                @Html.CheckBoxFor(modelItem => modelItem.Systemen[i].isSelected)
            </td>

        </tr>
    }
</table>

The HTML helpers use expressions to generate the correct markup, specifically the names which need to have the index in order to map correctly. If you use a foreach the expression doesn't contain an index so the name generated is incorrect and can't be mapped back on to the list. There is a superb answer to a similar question which gives a much better description of this than I ever could.

I've give all of this a quick test and it is working once the Model parameter is removed from BeginForm.

Your first suggestion worked, but now I recieve an empty List (debugger says Count = 0). I hope you can clarify why this happens. — EJN, Dec 17 '14 at 09:25
I think you need to change your foreach loop to a for and pass the index to the html helper methods so that it generates the correct names to map the array. I've updated my answer. — DoctorMick, Dec 17 '14 at 09:32
And I've just realised you shouldn't actually be specifying your model in the BeginForm, let the model binder deal with for you. Answer updated again. :) — DoctorMick, Dec 17 '14 at 09:53
It passed the model to the controller! New problem: the posted values are all false, no matter what I do :( — EJN, Dec 17 '14 at 10:11
That'e because of @Html.HiddenFor(modelItem => modelItem.Systemen[i].isSelected), it never changes so it always false and the model binder picks the first one to set the model value. If you remove that line it should work. — DoctorMick, Dec 17 '14 at 10:23

score 0 · Answer 2 · edited May 23 '17 at 12:26

0

I had same issue. I tried radio buttons instead of checkbox. Go through links

MVC3 @Html.RadioButtonfor Pass data from view to controller

View to Controller in mvc3

MVC3 @html.radiobuttonfor

How to pass List in Redirecttoaction

Might be your problem will solve.

edited May 23 '17 at 12:26

Community

1
1

answered Dec 17 '14 at 09:09

Ajay

6,418
18
79
130

I need to be able to select multiple values, so I have to use checkboxes instead of radio buttons. – EJN Dec 17 '14 at 09:21
Use `checkboxes` but try to implement my ways. – Ajay Dec 17 '14 at 09:22

score 0 · Answer 3 · answered Dec 17 '14 at 09:56

I reused your code, and did the changes; it works perfectly. Try using this code:

Model:

 public class Zoeken
    {
        public Zoeken() { Systemen = new List<CheckboxSysteem>(); }
        public List<VW_Checks> VwChecks { get; set; }
        public List<CheckboxSysteem> Systemen { get; set; }
    }

    public class CheckboxSysteem
    {
        public string Systeemnaam { get; set; }
        public bool isSelected { get; set; }
    }

Controller:

    // GET: 
    public ActionResult Index()
    {
        var model = new Zoeken();
        CheckboxSysteem obj1 = new CheckboxSysteem();
        CheckboxSysteem obj2 = new CheckboxSysteem();
        CheckboxSysteem obj3 = new CheckboxSysteem();

        obj1.Systeemnaam = "Check1";
        obj1.isSelected = true;
        obj2.Systeemnaam = "Check3";
        obj2.isSelected = false;
        obj3.Systeemnaam = "Check3";
        obj3.isSelected = true;

        model.Systemen.Add(obj1);
        model.Systemen.Add(obj2);
        model.Systemen.Add(obj3);

        return View(model);
    }

    [HttpPost]
    public ActionResult Index(Zoeken model)
    {         
       return View(model);
    }

View:

@model MvcApplication2.Models.Zoeken
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <div>
        @using (Html.BeginForm())
        {
            <table class="table">
                @for (int i = 0; i< Model.Systemen.Count; i++)
                {
                    <tr>
                        <td>
                            @Html.HiddenFor(m => m.Systemen[i].Systeemnaam)
                            @Html.HiddenFor(m => m.Systemen[i].isSelected)
                            @Html.DisplayFor(m => m.Systemen[i].Systeemnaam)
                        </td>
                        <td>
                            @Html.CheckBoxFor(m => m.Systemen[i].isSelected)
                        </td>

                    </tr>
                }
            </table>
            <input type="submit" value="Zoek" />
        }

    </div>
</body>
</html>

Comment if it still doesn't work.

View passes an empty model back to controller

3 Answers3