Joe Stevens' BlogEverything .NET and C#

When updating a model in MVC it is common to use the Controller.UpdateModel method.  I recently ran into an issue where I was using a custom ViewModel which meant that UpdateModel could not map the updated data back to my model object. The solution to this was a simple one, but not as obvious as it should be due to intellisense not picking up the method’s overloads when the generic type is inferred. 

 

When not using a ViewModel I may have a controller method like this: 

public ActionResult Edit(int id)
{
    Student student = context.Student.FirstOrDefault(s => s.ID.Equals(id));

    return View(student);
}

This is quite simply grabbing a student from my database using the Entity Framework and rendering a strongly typed view.  The view will have fields like so: 

<div>
    <%= Html.LabelFor(model => model.Forename) %>
</div>
<div>
    <%= Html.TextBoxFor(model => model.Forename)%>
    <%= Html.ValidationMessageFor(model => model.Forename)%>
</div>

<div>
    <%= Html.LabelFor(model => model.Surname)%>
</div>
<div>
    <%= Html.TextBoxFor(model => model.Surname)%>
    <%= Html.ValidationMessageFor(model => model.Surname)%>
</div>

I would then have a post method so save the student that may look like this: 

[HttpPost]
public ActionResult Edit(int id, FormCollection formValues)
{
    try
    {
        Student student = context.Student.FirstOrDefault(s => s.ID.Equals(id));
        UpdateModel(student);
        context.SaveChanges();

        return RedirectToAction("Details", new { id = student.ID });
    }
    catch
    {
        throw;
    }
}

UpdateModel will loop through the formValues collection and map the posted data to the student model object.  If I check the Keys in the collection I can see that they match the properties in my model, which is what makes the mapping successful. 

 

Now, what will happen if I use a ViewModel? It is good practice with MVC to create a seperate class that contains all the information required for the view.  Here is an example student view model which also contains a SelectList to populate the Title dropdown: 

 

public class StudentModel
{
    public Student Student { get; set; }
    public SelectList Titles { get; set; } 

    public StudentModel()
    { 

    } 

    public StudentModel(Student student, IEnumerable<Title> titles)
    {
        Student = student;
        Titles = new SelectList(titles, "ID", "Name", student.TitleID);
    }
} 

Here is how the edit method looks using the ViewModel: 

public ActionResult Edit(int id)
{
    Student student = context.Student.FirstOrDefault(s => s.ID.Equals(id));

    return View(new StudentModel(student, context.Title));
}

And here is how the view will now look: 

<div>
    <%= Html.LabelFor(model => model.Student.Title) %>
</div>
<div>
    <%= Html.DropDownListFor(model => model.Student.TitleID, Model.Titles)%>
</div>

<div>
    <%= Html.LabelFor(model => model.Student.Forename) %>
</div>
<div>
    <%= Html.TextBoxFor(model => model.Student.Forename)%>
    <%= Html.ValidationMessageFor(model => model.Student.Forename)%>
</div>

The problem now is that in my POST edit method the formValues collection now has the following keys: 

 

This is because the ViewModel contains the property Student which is the original model object.  It is still possible to use the UpdateModel method by using the overload that accepts a string prefix.  As I mentioned earlier it is easy to miss this as intellisense only picks it up when your specify the generic type: 

UpdateModel<Student>(student, "Student");

Here you can see I am passing the string Student as the prefix which allows the mapping to occur correctly.  You can still use the overload without specifying the type but intellisense won't pick it up, as shown in the full edit method below.

[HttpPost]
public ActionResult Edit(int id, FormCollection formValues)
{
    try
    {
        Student student = context.Student.FirstOrDefault(s => s.ID.Equals(id));
        UpdateModel(student, "Student");
        context.SaveChanges();

        return RedirectToAction("Details", new { id = student.ID });
    }
    catch
    {
        throw;
    }
}

I hope this helps someone as it caught me out and took me a little while to work out!