I am having a heck of time trying to figure out how to put a form inside of a bootstrap modal. I think my problem is when I try and return something from the controller. But you may spot some other problem with how I'm doing this. Here's what I've got:
The Parent View:
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog modalAE" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h3><strong>Edit Account Profile - <span class="accountname"></span></strong></h3>
</div>
@using (Html.BeginForm("AccountProfileEdit", "Account", FormMethod.Post, new { id = "form-accountedit-appt", @class = "full-form" }))
{
<div class="modal-body">
@Html.Partial("~/Views/Shared/_AccountProfileEdit.cshtml", new namespace.Models.AccountProfileEditViewModel())
</div>
<div class="modal-footer">
<button type="submit" id="accountprofileedit-submit" name="accountprofileedit-submit" value="Edit Account" class="btn btn-primary" style="margin-left:5px;">Edit Account</button>
<button type="button" class="btn btn-primary" data-dismiss="modal">Cancel</button>
</div>
}
</div>
</div>
</div>
The Partial View (slimmed down):
@model namespace.Models.AccountProfileEditViewModel
@Html.CustomTextboxFor(model => model.Address)
The Partial View's Model (also slimmed down):
public class AccountProfileEditViewModel
{
[Display(Name = "Address")]
[Required()]
[StringLength(200)]
public string Address { get; set; }
public AccountProfileEditViewModel() { }
}
The Partial View's Controller:
Note the question embedded in the code: WHAT DO I PUT HERE?
[HttpPost]
public ActionResult AccountProfileEdit([Bind]AccountProfileEditViewModel model)
{
if (Request.Form["accountprofileedit-submit"] != null)
{
if (ModelState.IsValid)
{
// logic to store form data in DB
}
}
return PartialView(**WHAT DO I PUT HERE??**, model);
}
No matter what I put here, it goes wrong. If I put the path to the partial view:
return PartialView("~/Views/Shared/_AccountProfileEdit.cshtml", model);
Then after the form is submitted, it just spits the html of the partial view onto the screen, totally out of context. But if I try this:
return PartialView("AccountProfileEdit", model);
I get an error: The partial view 'AccountProfileEdit' was not found or no view engine supports the searched locations.