MVC3 One View - Multiple PartialViews - One Model Per PartialView - asp.net-mvc

Question

I'm new to the whole MVC 3 style coding. I'm running into an issue, but first here's how I have my website laid out.
_Layout.cshtml contains
#if (Request.IsAuthenticated)
{
<div class="span2">
#Html.Partial("_NavigationPartial")
</div>
<div class="span10">
#RenderBody()
</div>
}
else
{
#RenderBody()
}
#RenderBody will display my Profile.cshtml file that contains the following:
#{
ViewBag.Title = "My Profile";
}
<div class="row-fluid well">
<div class="page-header">
<h1>
Profile</h1>
</div>
#{
Html.RenderPartial("ChangePersonalInformationPartial");
Html.RenderPartial("ChangePasswordPartial");
}
</div>
As you see, I have two Partials (One to change the Personal Information, the other to Change the Password).
Each one of these Partials uses it's own Model (ChangePersonalInformationModel and ChangePasswordModel).
My problem comes when I click submit on my ChangePasswordPartial, it reloads the _Layout.cshtml page but this time only loads up ChangePasswordPartial.cshtml. I need it to load up Profile.cshtml. But, if I go ahead and change under my AccountController.cs the return View(); to return View("Profile"); I get an error saying:
The model item passed into the dictionary is of type
'PROJECT.Models.ChangePasswordModel', but this dictionary requires a
model item of type 'PROJECT.Models.ChangePersonalInformationModel'.
How can I fix this problem?
Thanks!

Answer 1

Basically you have to make a redirect to the profile action in the ChangePassword action once you saved the password information.
UPDATE:
First you should have a common model say ProfileModel that wraps up the ChangePasswordModel and ChangePersonalInformationModel.
So here are the actions that displays the profile information for viewing and editing.
// this action will returns a views that displays profile info
public ViewResult Profile(string username)
{
ProfileModel model = .. get the profile from database based on username
return View(model);
}
// this action will returns the profile info for editing or adding a new profile
public ViewResult EditProfile(string username)
{
.. if the profile already exists get from database
ProfileModel model =
.. if this is a new profile create an empty model
ProfileModel model = new ProfileModel();
model.ChangePasswordModel = new ChangePasswordModel();
model.ChangePersonalInformationModel = new ChangePersonalInformationModel();
return View(model);
}
Your EditProfile.cshtml will be like this
#model Models.ProfileModel
...
#{
Html.RenderPartial("ChangePersonalInformationPartial",
Model.ChangePersonalInformationModel);
Html.RenderPartial("ChangePasswordPartial", Model.ChangePasswordModel);
}
...
This will be your ChangePassword action
[HttpPost]
public ActionResult ChangePassword(ChangePasswordModel model)
{
if(ModelState.IsValid)
{
// save the ChangePasswordModel to database and display the profile info
// or even you can redirect to EditProfile for more editing
return RedirectToAction("Profile");
}
.. there are validation errors so get the complete profile model from database
.. the ChangePasswordModel form will be filled by the details entered in the form
.. and not from the db details this will be taken care by the framework itself.
ProfileModel model =
return View("EditProfile", model);
}