Updating Master-Detail / Parent-Child data in MVC

Darren Brook

8y10.9k.NET

I have a view with a master-detail style view for an invoice. Master is invoice, detail is invoice lines. I'm trying to get detail data items to save on upon an edit post but the detail data is lost upon reaching the post Edit on the controller. So the master data saves fine but the detail is obviously not saved.

Invoice Class:

public class Invoice
{
public Invoice()
{
}
[Required]
[Key]
public int InvoiceID { get; set; }
[Required]
[StringLength(30)]
[DisplayName("Invoice Number")]
public string InvoiceNumber { get; set; }
[Required, DatabaseGenerated(DatabaseGeneratedOption.Computed)]
[DataType(DataType.Date)]
[Column(TypeName = "Date")]
[DisplayName("Invoice Date")]
public DateTime InvoiceDate { get; set; }
public List InvoiceLines { get; set; }
[ForeignKey("Client")]
public int OwnerClientIDFK { get; set; }
[DisplayName("Client")]
public Client Client { get; set; }
}

Invoice Line class:

public class InvoiceLine
{
public InvoiceLine()
{
}
[Key]
[Required]
public int InvoiceLineId { get; set; }
[Required]
[StringLength(255)]
[DisplayName("Item")]
public string ItemName { get; set; }
[DisplayName("Description")]
public string ItemDescription { get; set; }
[Required]
public int Quantity { get; set; }
[Required]
[DisplayFormat(DataFormatString = "{0:C}", ApplyFormatInEditMode = true)]
public decimal Value { get; set; }
[ForeignKey("ParentInvoice")]
public int InvoiceID { get; set; }
public Invoice ParentInvoice { get; set; }
}

Controller Edit (get):

public ActionResult Edit(int? id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
// Invoice invoice = db.Invoices.Find(id);
Invoice invoice = db.Invoices.Include(i => i.InvoiceLines)
.Include(i => i.Client)
.Where(c => c.InvoiceID == id).FirstOrDefault();
if (invoice == null)
{
return HttpNotFound();
}
ViewBag.OwnerClientIDFK = new SelectList(db.Clients, "ClientId", "CompanyName", invoice.OwnerClientIDFK);
return View(invoice);
}

Controller Edit (post):

public ActionResult Edit([Bind(Include = "InvoiceID,InvoiceNumber,InvoiceDate,OwnerClientIDFK")] Invoice invoice)
{
if (ModelState.IsValid)
{
db.Entry(invoice).State = EntityState.Modified;
foreach (var invLine in invoice.InvoiceLines)
{
db.Entry(invLine).State = EntityState.Modified;
}
db.SaveChanges();
return RedirectToAction("Index");
}
ViewBag.OwnerClientIDFK = new SelectList(db.Clients, "ClientId", "CompanyName", invoice.OwnerClientIDFK);
return View(invoice);
}

So in the above, when it reaches the foreach, it throws an exception because InvoiceLines is null.

View:

@model DemoApp.Entities.Invoice
@{
ViewBag.Title = "Edit";
}
<h2>Edith2>
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Invoiceh4>
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
@Html.HiddenFor(model => model.InvoiceID)
<div class="form-group">
@Html.LabelFor(model => model.InvoiceNumber, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.InvoiceNumber, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.InvoiceNumber, "", new { @class = "text-danger" })
div>
div>
<div class="form-group">
@Html.LabelFor(model => model.InvoiceDate, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.InvoiceDate, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.InvoiceDate, "", new { @class = "text-danger" })
div>
div>
<div class="form-group">
@Html.LabelFor(model => model.OwnerClientIDFK, "OwnerClientIDFK", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("OwnerClientIDFK", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.OwnerClientIDFK, "", new { @class = "text-danger" })
div>
div>
<div class="form-group">
<h2>Invoice Linesh2>
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="row">
<div class="col-md-8">
<table class="table">
<thead>
<tr>
<th>Itemth>
<th>Descriptionth>
<th>Qtyth>
<th>Unit Valueth>
tr>
thead>
<tbody>
@for (int i = 0; i < Model.InvoiceLines.Count; i++)
{
<tr>
<td>@Html.EditorFor(x => x.InvoiceLines[i].ItemName, new { htmlAttributes = new { @class = "form-control" } })td>
tr>
}
tbody>
table>
div>
div>
div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn btn-default" />
div>
div>
div>
}
<div>
@Html.ActionLink("Back to List", "Index")
div>
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
}

Any help appreciated. Thanks in advance.

5 Replies

Know the answer? Post it — somebody with the same question will find it here.

Prateek Singla8y ago
Thanks darren .You save my day!
one more thing Please share the form details for new controller . Have you made view model or used partial view for adding invoice lines. Please share the code.

Thanks
Prateek
Darren Brook8y ago
In my case, the problem was with the binding and the model being valid when being returning to the post edit method on the controller.

I had to include the detail/child class in the binding, which was Invoice Lines in my case.

The second part to the solution was ensuring that all the fields were available in the model used in the view for the model to be valid. To do this, I added hidden fields for all those data items in the child data entity that were not being otherwise used in the view.

However, the object reference on each invoice line back to the parent invoice object was not included, as when I did this, it broke the model validation, making model.IsValid always return false.

So the controller declaration looks like this:
public ActionResult Edit([Bind(Include = "InvoiceID,InvoiceNumber,InvoiceDate,OwnerClientIDFK, InvoiceLines")] Invoice invoice)
and within the view, the hidden fields like this:
<tr>
    <td>@Html.EditorFor(x => x.InvoiceLines[i].ItemName, new { htmlAttributes = new { @class = "form-control" } })td>
    <td>@Html.EditorFor(x => x.InvoiceLines[i].ItemDescription, new { htmlAttributes = new { @class = "form-control" } })td>
    <td>@Html.EditorFor(x => x.InvoiceLines[i].Quantity, new { htmlAttributes = new { @class = "form-control", style = "text-align:center" } })td>
    <td>@Html.EditorFor(x => x.InvoiceLines[i].Value, new { htmlAttributes = new { @class = "form-control", style = "text-align:right" } })td>
tr>
@Html.ValidationMessageFor(model => model.InvoiceLines[i].Value, "", new { @class = "text-danger" })
@Html.HiddenFor(model => model.InvoiceLines[i].InvoiceLineId)
@Html.HiddenFor(model => model.InvoiceLines[i].InvoiceIDFK)
Prateek Singla8y ago
Hello Darren Brook

Have you find any solution of your problem i am also working on the same problem but not able to find any . if you find any solution please share it.

Thanks
Prateek
Darren Brook8y ago
The problem is the child data not being passed back to the controller. Invoice and InvoiceLines are two entities with a one to many relationship. That's what I need to resolve.
Prateek Singla8y ago
Hello Derren Brook

Please Try this and if you still have issue Let me know.
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Edit(Invoice invoice)
{
if (!ModelState.IsValid)
{
ViewBag.OwnerClientIDFK = new SelectList(db.Clients, "ClientId", "CompanyName", invoice.OwnerClientIDFK);
return View(invoice);
}
if (invoice.InvoiceID == 0)
_context.Invoice.Add(invoice);
else
{
var invoiceInDb = _context.Invoice.Single(i => I.invoice == invoice.InvoiceID);
invoiceInDb.InvoiceNumber = invoice.InvoiceNumber;
invoiceInDb.InvoiceDate = invoice.InvoiceDate;
invoiceInDb.ParentInvoice = invoice.ParentInvoice;
}
_context.SaveChanges();
return RedirectToAction("Index", "Invoice");
}