ASP.Net MVC - Wie Objekte dynamisch zu einem Objekt hinzugefügt und an den Controller gebunden werden, um sie in einer Datenbank zu speichern?

Question

Ich möchte Elemente aus einem POCO-Objekt dynamisch hinzufügen und entfernen und in einer verknüpften Tabelle speichern. zum Beispiel:

class Contact{ 
    [Key] 
    public int id {get; set;} 
    [Required] public string name {get; set;} 
    public IEnumerable<Phone> phones{get; set;} 
} 

class Phone{ 
    [Key] 
    public int id {get;set;} 
    [Required] public string phone_type {get; set;} 
    [Required] public string phone_number {get; set;} 
} 

wo Kontakt viele Telefone haben kann.

Der Kontakt Bearbeiten Ansicht ist wie folgt:

@model SGD.Models.Contact 
@Html.LabelFor(model => model.name) 
@Html.EditorFor(model => model.name) 

@Html.LabelFor(model => model.phones) 
<div id="phones"></div> 

<a href="#" onclick="addPhone()">Add new phone</a> 

<script> 
    function addPhone() { 
     $.ajax({url: "/Phones/_Phone", 
      cache: false, 
      success: function(html) { $("#phones").append(html);}} 
    )} 
</script> 

den "Add new phone" Link-Button diese Teilansicht anhängen innerhalb #phones

div

@model SGD.Models.Phone 
@{ 
    Layout = null; 
} 

    @Html.HiddenFor(model => model.id) 

    @Html.LabelFor(model => model.phone_type) 
    @Html.EditorFor(model => model.phone_type) 
    @Html.ValidationMessageFor(model => model.phone_type) 

    @Html.LabelFor(model => model.phone_number) 
    @Html.EditorFor(model => model.phone_number) 
    @Html.ValidationMessageFor(model => model.phone_number) 

aber ich weiß nicht, wie man Behandeln und binden Sie die Postdaten im Controller und speichern Sie den Kontakt und die zugehörigen Telefoneinträge in der Datenbank. Wie kann ich es tun?

Answer 1

Zuerst würde ich this article von Phil Haack überprüfen.

Sie einen Mechanismus in Ihrem Javascript erforderlich Indizierung auf Ihr Telefon teilweise, gelten, aber in aller Kürze Ihre Teil-Bedürfnisse mehr zu sehen wie folgt aus:

@model SGD.Models.Phone 
@{ 
    Layout = null; 
} 

<input name="phones[0].id" style="display:none;"/> 

@Html.LabelFor(model => model.phone_type) 
<input name="phones[0].phone_type" /> 

@Html.LabelFor(model => model.phone_number) 
<input name="phones[0].phone_number" /> 

Was die Datenbank Teil, ich nehme an, dass Sie verwenden Entity Framework-Code zuerst basierend auf den Modellen, die Sie angezeigt haben. In diesem Fall gibt es einige Probleme mit den Code-First-Modellen. Lesen Sie msdn article, um zu erfahren, wie Code-First-Modelle für verschiedene Arten von Beziehungen richtig erstellt werden können. Ich nehme an, Sie beabsichtigen, eine Eins-zu-Viele-Beziehung zwischen Kontakten und Telefonen zu haben, wobei ein Kontakt viele Telefone haben kann. In diesem Fall sollten Sie Ihre Modelle wie folgt:

class Contact{ 
    [Key] 
    public int Id {get; set;} 
    public string name {get; set;} 
    public ICollection<Phone> phones{get; set;} 
} 

class Phone{ 
    [Key] 
    public int id {get;set;} 
    public string phone_type {get; set;} 
    public string phone_number {get; set;} 
    public Contact contact { get; set; } 
} 

Von dort nutzen Sie Ihren Kontext wie neue Handys an den entsprechenden Kontakte hinzufügen, damit in Ihrer addphone Aktionsmethode:

public ActionResult AddPhone(int ContactId) 
{ 
    var newPhone = new Phone(); 
    Contact ct = ctx.Contacts.Find(ContactId); 
    ct.Phones.Add(newPhone); 
    ctx.SaveChanges(); 
    return View(newPhone); 
} 

Sie werden auch müssen Aktionen EditPhone und DeletePhone implementieren.

Wie bei den Attributen [Erforderlich] müssen Sie sie entweder entfernen oder Ihre Ansicht komplett überdenken. Sie können nicht einfach "addphone" mit den erforderlichen Attributen "hinzufügen", ohne zuerst eine Eingabe zu machen. Sie müssen die Eingabe vom Benutzer erhalten, bevor Sie sie binden können, und derzeit sehe ich keine Bemühungen von Seiten dieses Benutzers.