I have 3 Models.

  • RequestSignature (main)
  • Pages (parent)
  • Signatures(child/PagesId Foreingkey)

It can have many Pages and many Signatures for each RequestSignature

Here is the HTML to bind the collections by Index, Pages and Signatures

<div id="ParentContainer[0]" class="ParentContainer ui-droppable" rel="0">

    <input type="hidden" id="ParentIndex" name="Pages.Index" value="Page0">

    <input id="ImageWidth" name="Pages[Page0].ImageWidth" type="hidden" value="553">
    <input id="ImageHeight" name="Pages[Page0].ImageHeight" type="hidden" value="715">
    <input id="NaturalWidth" name="Pages[Page0].NaturalWidth" type="hidden" value="1224">
    <input id="NaturalHeight" name="Pages[Page0].NaturalHeight" type="hidden" value="1584">
    <input type="hidden" id="Date" name="Pages[Page0].Date" value="12/16/2014 9:59:26 AM">

    <div id="Signature0" rel="0" class="signature ui-draggable ui-draggable-handle ui-resizable" style="cursor: move; z-index: 1200; width: 160px; height: 90px; position: absolute; top: 99px; left: 146px; border: 1px dashed black; background-color: rgba(158, 158, 158, 0.65098);">

        <p style="text-align: center; position: relative; top: 50%; transform: translateY(-50%);">Signature Location</p>

        <input type="hidden" id="SignatureIndex" name="Pages[Page0].Signatures.Index" value="Signature0">

        <input type="hidden" id="Date" name="Pages[Page0].Signatures[Signature0].Date" value="12/16/2014 9:59:26 AM">
        <input type="hidden" id="x2Width" class="x2Width" name="Pages[Page0].Signatures[Signature0].xWidth" value="158">
        <input type="hidden" id="y2Height" class="y2Height" name="Pages[Page0].Signatures[Signature0].yHeight" value="88">
        <input type="hidden" id="x1Position" class="x1Position" name="Pages[Page0].Signatures[Signature0].xPosition" value="146">
        <input type="hidden" id="y1Position" class="y1Position" name="Pages[Page0].Signatures[Signature0].yPosition" value="99">
    </div>

</div>

<div id="ParentContainer[1]" class="ParentContainer ui-droppable" rel="1">

    <input type="hidden" id="ParentIndex" name="Pages.Index" value="Page1">

    <input id="ImageWidth" name="Pages[Page1].ImageWidth" type="hidden" value="553">
    <input id="ImageHeight" name="Pages[Page1].ImageHeight" type="hidden" value="715">
    <input id="NaturalWidth" name="Pages[Page1].NaturalWidth" type="hidden" value="1224">
    <input id="NaturalHeight" name="Pages[Page1].NaturalHeight" type="hidden" value="1584">
    <input type="hidden" id="Date" name="Pages[Page1].Date" value="12/16/2014 9:59:26 AM">

</div>

Each html page has many parents and children. To bind them together, I did a nested collection as follows:

  • Hidden field Pages.Index has a value of Page0
  • Hidden field Pages[Page0].Signature.Index has a value of Signature0

The last character of Page0 and Signature0 are incremental, so the next Page will be Page1 and Signature1 and so on.

The Models:

public class Pages
    {
        public Pages()
        {
            Signatures = new Collection<Signatures>();
        }

        public int Id { get; set; }

        [Required]
        public string DocOrigImg { get; set; }

        public string DocSignedImg { get; set; }

        [Required]
        public int ImageWidth { get; set; }
        [Required]
        public int ImageHeight { get; set; }
        [Required]
        public int NaturalWidth { get; set; }
        [Required]
        public int NaturalHeight { get; set; }
        [Required]
        public DateTime Date { get; set; }

        public int RequestSignatureId { get; set; }
        [ForeignKey("RequestSignatureId")]
        public virtual RequestSignature RequestSignature { get; set; }

        public virtual ICollection<Signatures> Signatures { get; set; }

    }

public class Signatures
    {
        public int Id { get; set; }

        [Required]
        public int xPosition { get; set; }

        [Required]
        public int yPosition { get; set; }

        [Required]
        public int xWidth { get; set; }

        [Required]
        public int yHeight { get; set; }

        [Required]
        public DateTime Date { get; set; }

        public int PagesId { get; set; }
        //[ForeignKey("PagesId")]

        public virtual Pages Pages { get; set; }
    }

Model Builder:

   modelBuilder.Entity<Signatures>().HasRequired(current => current.Pages)
            .WithMany(c => c.Signatures)
            .HasForeignKey(d => d.PagesId)
            .WillCascadeOnDelete(false);

To save all Parents/Children, I post the model to the controller as follows:

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create(RequestSignature RequestSignature)
{
    db.RequestSignature.Add(RequestSignature);
    db.SaveChanges();
}

If I stop the debug at db.RequestSignature.Add(RequestSignature) it shows the parents/children relation correct, but when it saves to the DB, if I have 2 Pages, Page0 and Page1 but only Page1 has a child, it saves the Page1(ForeignKey) child as a Page0(ForeignKey) child

Related posts

Recent Viewed