Wie binde ich dynamisch hinzugefügte Felder mithilfe von Html.BeginCollectionItem ordnungsgemäß an ein Modell?

Teilansicht beim Übergeben einer Sammlung mithilfe des Html.BeginCollectionItem-Helfers

Problem

In einem Projekt, das den Html.BeginCollectionItem-Helfer verwendet, wurden neue Felder von JavaScript generiert Nicht bindend für das Modell während der Formularübermittlung. Darüber hinaus hat der BeginCollectionItem-Helfer keine ausgeblendeten Tags für die neuen Felder gerendert.

Lösung

1. Erstellen Sie ein Ansichtsmodell:

Definieren Sie ein Ansichtsmodell (z. B. CashRecipientVM), um die zu bearbeitenden Daten mit entsprechenden Datenanmerkungen darzustellen.

2. Erstellen Sie eine Teilansicht:

Erstellen Sie eine Teilansicht (_Recipient.cshtml) mithilfe des BeginCollectionItem-Helfers, einschließlich der erforderlichen Beschriftungen, Textfelder und einer Schaltfläche zum Löschen.

3 . Implementieren Sie eine Methode, um die Teilansicht zurückzugeben:

Implementieren Sie eine Methode im Controller, um die Teilansicht zurückzugeben (z. B. Recipient()).

4. GET-Methode aktualisieren:

Erstellen Sie in der GET-Methode der Hauptansicht eine erste Liste von Ansichtsmodellen.

5. Hauptansicht aktualisieren:

Verwenden Sie in der Hauptansicht eine foreach-Schleife, um die vorhandenen Objekte anzuzeigen und fügen Sie die Teilansicht mithilfe des BeginCollectionItem-Helfers hinzu.

6. Implementieren Sie JavaScript zum Hinzufügen von Elementen:

Schreiben Sie JavaScript, um dem Formular den HTML-Code für ein neues Ansichtsmodell hinzuzufügen, wenn Sie auf eine Schaltfläche klicken.

7. Implementieren Sie JavaScript zum Löschen von Elementen:

Schreiben Sie JavaScript, um ein Element zu löschen, wenn Sie auf die Schaltfläche „Löschen“ klicken, und stellen Sie eine entsprechende AJAX-Anfrage an den Server.

8. POST-Methode aktualisieren:

Aktualisieren Sie das Formular, um es an eine Methode zurückzusenden, die eine Sammlung der Ansichtsmodelle empfängt (z. B. Create(IEnumerable Empfänger)).

Zusätzliche Hinweise:

• Stellen Sie sicher, dass das Skript zum Hinzufügen von Elementen die richtige URL verwendet für die Recipient-Methode.
• Verwenden Sie Datenanmerkungen, um die Daten auf der Clientseite zu validieren.
• Um die Leistung zu verbessern, erwägen Sie die Verwendung eines knockout.js- oder MVVM-Frameworks anstelle von JavaScript für die Datenbindung.

Das obige ist der detaillierte Inhalt vonWie binde ich dynamisch hinzugefügte Felder mithilfe von Html.BeginCollectionItem ordnungsgemäß an ein Modell?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!