Question

I have the following viewModel:

public class CreateCardViewModel
    {
        [HiddenInput(DisplayValue = false)]
        public int SetId { get; set; }

        [Required]
        public ICollection<Side> Sides { get; set; }

        [Required]
        [DataType(DataType.Date)]
        public DateTime DateCreated { get; set; }

        [Required]
        public bool IsReady { get; set; }

    }

And the following actions defined for Create:

[HttpGet]
        public ActionResult Create(int setId)
        {
            var model = new CreateCardViewModel();

            // attach card to current set
            model.SetId = setId;

            // create a new Side
            var side = new Side() {Content = "Blank Side"};

            // Add this to the model's Collection
            model.Sides = new Collection<Side> { side };

            return View(model);
        }

        [HttpPost]
        public ActionResult Create(CreateCardViewModel viewModel)
        {
            if (ModelState.IsValid)
            {
                var set = _db.Sets.Single(s => s.SetId == viewModel.SetId);
                var card = new Card {Sides = viewModel.Sides};

                set.Cards.Add(card);

                _db.Save();
            }
            return View(viewModel);


        }

When I try to create a new card, the Sides property of the viewModel is null, so the ModelState is coming up as null. I can’t quite figure out why that initial Side isn’t getting passed with the model.

My View looks like this:

<h2>Create</h2>

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>CreateCardViewModel</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.SetId)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.SetId)
            @Html.ValidationMessageFor(model => model.SetId)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.DateCreated)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.DateCreated)
            @Html.ValidationMessageFor(model => model.DateCreated)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.IsReady)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.IsReady)
            @Html.ValidationMessageFor(model => model.IsReady)
        </div>

        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}

Answer 1

There’s nothing in your View that is bound to the Sides property of your ViewModel. Without anything in the form to hold the value of that property, it will be null when model binding occurs. You’ll need to somehow capture the Side in your form – how are you adding to/removing from this property? Via user interaction that should take place on the form?