Maison > interface Web > js tutoriel > le corps du texte

Comment transmettre un objet JSON via les données d'un formulaire HTML ?

Susan Sarandon
Libérer: 2024-10-19 12:01:30
original
701 Les gens l'ont consulté

How to Transmit a JSON Object via HTML Form Data?

Transmission d'un objet JSON via les données d'un formulaire HTML

Lors de la soumission d'un formulaire, les données sont généralement envoyées sous forme de champs de formulaire individuels. Cependant, si vous souhaitez envoyer des données sous forme d'objet JSON, vous pouvez utiliser les méthodes suivantes :

Méthode 1 : sérialisation du tableau FormData

Convertissez les données du formulaire en un tableau à l'aide de SerializeArray() de jQuery. méthode, puis stringifiez-la en JSON.

var formData = JSON.stringify($("#myForm").serializeArray());
Copier après la connexion

Méthode 2 : Zone de texte cachée

Créez une zone de texte masquée dans le formulaire et définissez sa valeur sur les données du formulaire stringifié JSON. Cette méthode vous permet d'accéder aux données côté serveur après la soumission du formulaire.

<input type="hidden" name="data" value="{&quot;first_name&quot;:&quot;binchen&quot;,&quot;last_name&quot;:&quot;heris&quot;}">
Copier après la connexion

Décodage côté serveur

Si les données JSON sont transmises dans le cadre d'une soumission de formulaire régulière, elles doit être décodé côté serveur. Par exemple, en PHP :

$data = json_decode($_POST['data']);
Copier après la connexion

Résolution d'erreur XHR

Dans votre code, le problème peut résider dans le fait de négliger de définir explicitement l'en-tête Content-Type sur application/json. Le code corrigé devrait être :

xhr.setRequestHeader('Content-Type', 'application/json');
Copier après la connexion

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
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