jQuery à PHP via Ajax en utilisant JSON

Ce didacticiel montre comment envoyer des données JSON via AJAX (méthode post) de jQuery à un script PHP, puis décoder ces données dans des variables PHP utilisables. Bien que cet exemple utilise l'entrée de formulaire, l'origine des données JSON est flexible.

JQUERY AJAX Implémentation

Cette fonction AJAX transmet les données JSON au script PHP côté serveur:

$.ajax({
    type: "POST",
    url: targetURL,
    async: false,
    data: JSON.stringify($('#form').serializeArray()),
    success: function(data){
        console.log(data);
        return true;
    },
    complete: function() {},
    error: function(xhr, textStatus, errorThrown) {
        console.log('AJAX loading error: ' + textStatus + ' - ' + errorThrown);
        return false;
    }
});

Le JSON généré ressemble à cette (paires de valeurs de nom):

data=[{"name":"product","value":"riserva shiraz wine glass"},{"name":"supid","value":"81"},{"name":"brandid","value":"60"},{"name":"blid","value":"7"},{"name":"cid","value":"381"}];

Traitement des données PHP

Le code PHP décode le JSON et gère les données:

// Decode JSON string into a PHP associative array
$decoded = json_decode($_POST['data'], true); // Note: Changed to $_POST

// Output values:
echo "Outputting values:\n";
foreach ($decoded as $value) {
    echo $value["name"] . "=" . $value["value"] . "\n";
}

// Set values as PHP variables:
echo "\nSetting variables:\n";
foreach ($decoded as $value) {
    $$value["name"] = $value["value"];
    echo $value["name"] . "=" . $$value["name"] . "\n";
}

(Remarque: le code d'origine utilisé $_GET; cela a été corrigé à $_POST pour une demande de poste.)

Questions fréquemment posées (FAQ)

Cette section aborde les questions courantes concernant l'interaction jQuery, PHP, AJAX et JSON.

• Gestion des erreurs dans jQuery ajax: Utilisez la méthode .fail() dans votre appel jQuery Ajax pour attraper et gérer les erreurs gracieusement. La fonction de rappel .fail() reçoit des informations d'erreur (par exemple, xhr, textStatus, errorThrown) permettant une gestion spécifique des erreurs.

• Envoi de plusieurs données avec jQuery Ajax: Utilisez un littéral d'objet dans l'option data de $.ajax(). Les paires de valeurs clés dans l'objet représentent les données à envoyer. PHP accède à ces données via $_POST ou $_GET.

• en utilisant les données JSON renvoyées de PHP dans jQuery: Utiliser $.parseJSON() pour convertir la chaîne JSON reçue de PHP en un objet JavaScript pour un accès facile.

• Synchrones vs Ajax asynchrones: jQuery Ajax est asynchrone par défaut (async: true). Le réglage async: false le rend synchrone, mais cela est généralement découragé car il peut bloquer le navigateur.

• Envoi d'objets JSON de jQuery à php: Utiliser JSON.stringify() dans jQuery pour convertir l'objet JavaScript en une chaîne JSON avant l'envoi. Php utilise json_decode() pour l'analyser.

• Utilisation des méthodes de publication et d'obtention dans jQuery ajax: Utiliser $.post() pour les demandes de publication et $.get() pour les demandes de get. Ce sont des versions simplifiées de $.ajax().

• Réglage du type de contenu dans jQuery ajax: Utilisez l'option contentType dans $.ajax(). Pour JSON, définissez-le sur "application/json".

• Gestion des demandes AJAX réussies: Utilisez la méthode .done() en jQuery pour gérer les réponses réussies.

• Annulation de demandes AJAX: Utilisez la méthode .abort() pour annuler une demande AJAX en attente. Le succès n'est pas garanti en fonction du navigateur et du type de demande.

N'oubliez pas de remplacer targetURL par l'URL réelle de votre script PHP. Un exemple de travail nécessite un script PHP fonctionnel sur un serveur.

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!