Click here to Skip to main content
15,566,394 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Hello to all,

I try to open a modal dialog, pass a model to the dialog and get the model back to the controller. Because I'm not very familiar to ASP.NET and MVC I seached the net and found this: Bootstrap Modal Dialog - Loading Content from MVC Partial View
So far, so good. I've made some modifications to fit my requirements, but I won't get back the modified values out of the modal view back to my controller.

Some more details: I have models that look like:
C#
public class User
{
  public Int32 ID { get; set; }
  ...
  public Contact Contact { get; set; }
  ...
}

public class Contact
{
  public Int32 ID { get; set; }
  ...
  public List<ContactPropertyValue> ContactPropertyValues { get; set; }
  public List<ContactProperty>      ContactProperties { get; set; }
  ...
}

public class ContactPropertyValue
{
  public Int32  ID { get; set; }
  public Int32  UserID { get; set; }
  public Int32  ContactPropertyID { get; set; }
  public string ContactPropertyValue ( get; set; }
}

public class ContactProperty
{
  public Int32  ContactPropertyID { get; set; }
  public string ContactPropertyName { get; set; }
}

This structure is implemented to keep compatibility to outlook contact parameters. For example there is a list of ContactProperties
C#
List<ContactProperty> lstContactProperty = new List<ContactProperty> {
    new ContactProperty {ContactPropertyID=1, ContactPropertyName="LastName" },
    new ContactProperty {ContactPropertyID=2, ContactPropertyName="FirstName" },
    new ContactProperty {ContactPropertyID=3, ContactPropertyName="PhoneNumber" },
    ...}

And out of this I can create a list of ContactPropertyValues for my contacts:
C#
List<ContactPropertyValue> lstContactPropertyValue = new List<ContactPropertyValue> {
  new ContactPropertyValue {ID=1, UserID=1, ContactPropertyID=1, ContactPropertyValue="Miller" },
  new ContactPropertyValue {ID=2, UserID=1, ContactPropertyID=2, ContactPropertyValue="Marc" },
  new ContactPropertyValue {ID=3, UserID=1, ContactPropertyID=3, ContactPropertyValue="123-456" },
  new ContactPropertyValue {ID=4, UserID=2, ContactPropertyID=1, ContactPropertyValue="Smith" },
  new ContactPropertyValue {ID=5, UserID=2, ContactPropertyID=2, ContactPropertyValue="Lara" },
  new ContactPropertyValue {ID=6, UserID=2, ContactPropertyID=3, ContactPropertyValue="123-789" },
  ... }

Now I give the User model to my edit view where the @Html.ActionLink for the modal dialog is placed.
HTML
@model MyApp.Models.User
...
@using (Html.BeginForm("Edit", "User", FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
{
  ...
  <div class="col-sm-1">
    @Html.ActionLink("Contact Details", "ViewContactDetails", "User", null, new { @class = "modal-link btn btn-default" })
  </div>
  ...
} @*end using*@

The parital view looks like:
HTML
@model MyApp.Models.User
...
@using (Html.BeginForm("ContactDetails", "User", @Model, FormMethod.Post))
{
  ...
  <div class="text-nowrap" id="divContactDetails">@Html.Partial("../Contacts/_ContactDetails", Model.Contact )</div>
} @*end using*@

This construct is done to reuse the view "_ContactDetails". It looks like:
HTML
@model MyApp.Models.Contact
<div class="form-group">
  <h1>Contact Details</h1>
</div>
...
<div class="form-group">
  @Html.Label("Lastname", new { @class = "col-sm-3 control-label" })
  <div class="col-sm-6">
  @{
  propertyId = Model.ContactProperies.Find(x => x.Name == "LastName").ContactPropertyID;
  propertyValueId = Model.ContactPropertyValues.Find(y => y.ContactPropertyId == propertyId).ID;
  }
  @Html.TextBoxFor(m => m.ContactPropertyValues[propertyValueId].ContactPropertyValue, new { @class = "form-control", id = "idLastName" })
  </div>

The controller looks like:
C#
public async Task<ActionResult> ViewContactDetails()
{
  User user = ... ; 
  return PartialView("Modals/_mdlContactDetailsNew", user);
}

[HttpPost]
public ActionResult ContactDetails(User user)
{
  //here I expect my modified data, but I don't get them :-(
  return RedirectToAction("Edit", user);
}


It all works well - I can open the modal dialog with the parital view in it and I see all my contact properties. But if I modify them and call the save function (ActionResult ContactDetails) there are still the old values set.

Is there anybody who knows the trick to get it work?
Posted
Comments
F-ES Sitecore 20-May-15 7:55am    
I don't see where you are submitting the form anywhere in order to pass your data to the controller.

My advice would be to first get the page working without the modal box, just put the fields direct on the page, as until you understand the basics of mvc and http there is little chance you're going to get the solution working in a modal box. Once it works without the modal box it'll probably come to you what you need to do from there.
Matz65 21-May-15 3:42am    
Thanks for your comment. In deed I did not post the button for submitting the form but you can trust me, in my application it is there:
<button type="submit" id="approve-btn" class="btn btn-success">√úbernehmen</button>

I have the partial view "_ContactDetails" implemented into an other view (but not modal) called by the ContactController. Here it works well.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900