Comment implémenter un nombre de formulaires dynamiquement variable dans ASP.NET MVC?

Question

J'ai une entité Person qui contient un ensemble d'entités "Education". Ce que je veux, c'est collecter le nombre "N" d'entrées Education du formulaire. Ce «N» est contrôlé par les boutons «Ajouter plus d'informations sur l'éducation» et «Supprimer les informations sur l'éducation». Au début, il y a un formulaire vide qui va collecter une entrée Éducation. (l'objet "personne", qui est stocké en session, contient initialement une entité éducative vide et j'appelle View avec cet objet "personne")

Si l'utilisateur clique sur le bouton "Ajouter plus d'informations sur l'éducation", un autre formulaire est [J'ajoute un autre objet éducatif à "personne" et j'appelle à nouveau la vue]

Cela fonctionne bien, mais les anciennes données sont perdues. Mieux vaut dire que les données dans les formulaires ne sont pas mappées aux entités Éducation et sont perdues, même si j'appelle TryUpdateModel (personne). Chaque fois que je clique sur le bouton «Ajouter plus d'informations sur l'éducation», toutes les données entrées précédemment sont perdues et tous les formulaires deviennent vides. Question: Y a-t-il une meilleure façon de résoudre ce genre de problèmes (nombre de formulaires changeant de façon dynamique)? Ou que devrais-je changer pour préserver les anciennes données?

Merci.

J'espère pouvoir expliquer mon problème.

Answer 1

Je pense que vous feriez mieux d'étendre le formulaire unique et de le faire récupérer un tableau d'entités. Cela est, demandez à votre première utilisation ids de forme comme:

<%= Html.Hidden("Schools.index", 0) %> 
<%= Html.TextBox("Schools[0].Name") %> 
... 

Ensuite, ajouter de nouveaux éléments avec un nouvel indice.

<input type="hidden" id="Schools_index" name="Schools.index" value="1" /> 
<input type="text" id="Schools[1]_Name" name="Schools[1].Name" /> 
... 

Et les recevoir comme une collection

public ActionResult AddEducation(Person person, School[] schools) 
{ 
} 

Cela vous tous de soumettre toutes les informations d'un seul coup et ne pas avoir à vous soucier de présentations partielles et ce qu'il faut faire avec les demandes incomplètes.

Notez que votre javascript devra trouver l'index maximum actuel pour savoir quels seront les noms/identifiants des nouveaux éléments.

$('#addSchooButton').click(function() { 
    var index = $('#form').find('[name=Schools.index]:last').attr('value') + 1; 
    $('<input type="text" id="Schools[' + index + ']_Name" name="Schools[' + index + '].Name" />').appendTo('#form'); 
    ... 
}); 

En réalité, vous auriez probablement créer un conteneur entier - peut-être par le clonage d'un seul et existant en remplaçant les ids dans le clone avec les appropriés en fonction de la prochaine valeur de l'indice.

Pour plus d'informations, reportez-vous à l'article de Phil Haack sur model binding to a list.