Maison > interface Web > js tutoriel > Comment transmettre et récupérer un objet de modèle complet à l'aide de FormData dans MVC ?

Comment transmettre et récupérer un objet de modèle complet à l'aide de FormData dans MVC ?

Barbara Streisand
Libérer: 2024-12-17 14:41:12
original
581 Les gens l'ont consulté

How to Pass and Retrieve a Complete Model Object Using FormData in MVC?

Transmission et récupération de données de modèle à l'aide de FormData dans MVC

La transmission d'un objet de modèle complet via FormData peut être bénéfique lorsque vous travaillez avec des données complexes dans votre application Web. Voici comment y parvenir :

JavaScript :

Utilisez le constructeur FormData() avec l'élément form pour sérialiser le modèle :

var formdata = new FormData($('form').get(0));
Copier après la connexion

Cela capturera les données des contrôles du formulaire, y compris tous les fichiers joints via .

Requête AJAX :

Configurez votre requête AJAX avec les paramètres appropriés :

$.ajax({
  url: '@Url.Action("YourActionName", "YourControllerName")',
  type: 'POST',
  data: formdata,
  processData: false,
  contentType: false,         
});
Copier après la connexion

Contrôleur :

Dans votre contrôleur, créez une action pour gérer le request :

[HttpPost]
public ActionResult YourActionName(YourModelType model)
{
}
Copier après la connexion

MVC liera automatiquement les données du modèle sérialisé à une instance de YourModelType. Si le modèle contient une propriété pour HttpPostedFileBase, l'action de votre contrôleur peut également inclure un paramètre pour celle-ci.

Données supplémentaires :

Si vous devez inclure des données supplémentaires qui n'est pas présent dans le formulaire, vous pouvez utiliser la méthode append() sur l'objet FormData :

formdata.append('someProperty', 'SomeValue');
Copier après la connexion

En suivant ces étapes, vous pouvez transférer un objet modèle complet via FormData lors d'une requête AJAX et le récupérer facilement dans l'action du contrôleur correspondante pour un traitement ultérieur.

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal