Comment afficher correctement les tableaux de formulaires de ASP.NET MVC à un modèle IEnumerable?

Publication des tableaux de formulaire à partir de ASP.NET MVC

Problème:

Dans une application ASP.NET MVC, une application HTML Le formulaire contenant un tableau dynamique d'éléments d'entrée doit être soumis en tant que IEnumerable & lt; BatchProductViewModel & gt; propriété modèle. Cependant, la méthode d'action ne lie pas le modèle avec les données de la forme lors de l'utilisation de FormCollection comme paramètre de méthode.

Solution:

Au lieu d'utiliser une forme de forme, la FormCollection, la La méthode d'action doit accepter une instance du type de modèle correct, connectBatchProductViewModel, comme paramètre. Pour générer un formulaire qui publie des valeurs de formulaire sur une propriété ienumable dans le modèle, suivez ces étapes:

• Utilisez une boucle pour générer les commandes pour chaque élément de la collection. Chaque contrôle doit être nommé avec des indexeurs pour se lier correctement au modèle.
• Ajouter un élément d'entrée masqué à chaque ligne ajoutée dynamiquement pour permettre la suppression des éléments de la vue.
• Mettez à jour la méthode d'action pour Recevez le modèle en tant que paramètre.

Exemple de code:

Code de formulaire:

@for(int i = 0; i < Model.BatchProducts.Count; i++)
{
  <tr>
    <td>@Html.TextBoxFor(m => m.BatchProducts[i].Quantity)</td>
    <td>@Html.TextBoxFor(m => m.BatchProducts[i].BatchName)</td>
    <td>
      <input type="hidden" name="BatchProducts.Index" value="@i" />
      <a class="deleteRow"></a>
    </td>
  </tr>
}

Méthode d'action:

public ActionResult Save(ConnectBatchProductViewModel model)
{
  // Model binding will populate the BatchProducts property with data from the form.
  ....
}

Ajouter et supprimer dynamiquement les éléments:

pour permettre l'ajout dynamique et la suppression des éléments, utilisez l'assistant BeginCollectionItem ou un Helper ou un Modèle HTML. Le modèle pour ajouter dynamiquement de nouveaux éléments serait:

<div>

Et le script pour ajouter un nouvel élément BatchProducts serait:

$("#addrow").click(function() {
  var index = (new Date()).getTime(); // unique indexer
  var clone = $('#NewBatchProduct').clone(); // clone the BatchProducts item
  // Update the index of the clone
  clone.html($(clone).html().replace(/\[#\]/g, '[' + index + ']'));
  clone.html($(clone).html().replace(/"%"/g, '"' + index  + '"'));
  $("table.order-list").append(clone.html());
});

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!