Maison développement back-end tutoriel php Guide d'utilisation AJAX en PHP

Guide d'utilisation AJAX en PHP

May 22, 2023 am 08:15 AM
php ajax 操作指南

Avec le développement de la technologie Internet, le développement Web front-end est devenu de plus en plus important. Dans le développement web, l’émergence de JavaScript a accéléré la mise en œuvre de nombreuses interactivités et dynamiques. Cependant, JavaScript n'est pas un langage back-end et ne peut pas interagir directement avec les bases de données ou les systèmes de fichiers. Par conséquent, afin de parvenir à un développement Web plus efficace, la technologie AJAX a été introduite.

AJAX est l'abréviation de "Asynchronous JavaScript and XML". Il utilise les technologies JavaScript, XML, HTML et CSS pour réaliser une transmission de données asynchrone et peut interagir avec le serveur sans actualiser la page. En PHP, la technologie AJAX est de plus en plus utilisée. Cet article fournira une explication détaillée des opérations AJAX en PHP.

1. Interaction sans actualiser la page

Dans les applications Web, les opérations des utilisateurs peuvent nécessiter l'obtention de données du serveur, telles que des résultats de recherche, des requêtes asynchrones, des soumissions de formulaires, etc. En prenant comme exemple la soumission d'un formulaire, le moyen le plus simple est de définir un bouton de soumission dans la balise

de la page :

<form action="submit.php" method="post">
    ...
    <input type="submit" value="提交">
</form>
Copier après la connexion

Une fois que l'utilisateur a soumis le formulaire, la page se rechargera et les données du formulaire seront envoyées. à la fin du serveur, afin que l'utilisateur puisse obtenir la réponse renvoyée par le serveur. Cependant, cette méthode nécessite de recharger la page, ce qui entraîne des retards inutiles et affecte l'expérience utilisateur.

Afin d'éviter cette situation, nous pouvons utiliser la technologie AJAX pour implémenter la soumission de formulaire sans actualiser la page. Cela peut être réalisé des manières suivantes :

var xhr = new XMLHttpRequest();
xhr.open("POST", "submit.php", true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.onreadystatechange = function() {
    if(xhr.readyState === 4 && xhr.status === 200) {
        document.getElementById("result").innerHTML = xhr.responseText;
    }
};
var formData = new FormData(document.getElementById("form"));
xhr.send(formData);
Copier après la connexion

Le code ci-dessus crée d'abord l'objet XMLHttpRequest xhr, puis utilise l'open. méthode pour configurer la méthode de requête (POST), l'URL (submit.php) et la transmission asynchrone (true). Ensuite, utilisez la méthode setRequestHeader pour définir les informations d’en-tête Content-type. Dans la fonction de rappel onreadystatechange, nous pouvons déterminer l'état de la demande et le code d'état de la réponse pour garantir que la demande est renvoyée avec succès. Enfin, utilisez l'objet FormData pour obtenir les données du formulaire et envoyez la demande via la méthode d'envoi.

2. Utilisez jQuery pour implémenter AJAX

jQuery est une bibliothèque JavaScript populaire qui fournit une série de fonctions et d'outils pratiques pour simplifier les opérations AJAX. Avec jQuery, nous pouvons facilement implémenter des requêtes AJAX. Voici un exemple de code pour implémenter AJAX à l'aide de jQuery :

$("#form").on("submit", function(event) {
    event.preventDefault();
    $.ajax({
        url: "submit.php",
        type: "POST",
        data: new FormData(this),
        processData: false,
        contentType: false,
        success: function(data) {
            $("#result").html(data);
        },
        error: function() {
            alert("请求失败!");
        }
    });
});
Copier après la connexion

Le code ci-dessus utilisera la méthode ajax de jQuery pour effectuer une requête AJAX. Avant de soumettre le formulaire, nous utilisons event.preventDefault() pour empêcher l'événement de soumission de formulaire par défaut afin de ne pas actualiser la page. Ensuite, définissez l'attribut url sur submit.php, l'attribut type sur POST, utilisez l'objet FormData pour obtenir les données du formulaire et définissez les attributs processData et contentType sur false pour garantir que les données du formulaire ne sont pas traitées. Lorsque la demande réussit, nous pouvons effectuer les opérations correspondantes dans la fonction de rappel de réussite. Lorsque la requête échoue, nous pouvons la gérer en conséquence dans la fonction de rappel d'erreur.

3. Accès AJAX aux données JSON renvoyées par PHP

Lorsqu'une requête AJAX est adressée à PHP, PHP peut renvoyer différents types de données, tels que HTML, XML, JSON et du texte ordinaire. En PHP, l'utilisation de JSON pour l'échange de données devient de plus en plus populaire, le retour des données JSON dans les requêtes AJAX est donc devenu un problème important. Ce qui suit est un programme PHP simple qui montre comment renvoyer les données de la base de données au format JSON :

<?php
    $db = new PDO("mysql:host=localhost;dbname=test", "root", "password");
    $query = $db->prepare("SELECT * FROM users");
    $query->execute();
    $result = $query->fetchAll(PDO::FETCH_ASSOC);
    echo json_encode($result);
?>
Copier après la connexion

Le code ci-dessus utilise la bibliothèque PDO pour se connecter à la base de données et obtenir toutes les données de la table des utilisateurs. Grâce à la fonction json_encode, nous convertissons les données au format JSON et les affichons sur la page. Ensuite, les données peuvent être obtenues et traitées dans la requête AJAX :

$.ajax({
    url: "get_data.php",
    type: "GET",
    dataType: "json",
    success: function(data) {
        console.log(data);
    }
});
Copier après la connexion

Le code ci-dessus utilise la méthode ajax de jQuery pour obtenir les données et définit l'attribut dataType sur json. Lorsque la demande réussit, le paramètre data contiendra des données au format JSON et nous pourrons utiliser la méthode console.log pour afficher les données. Bien entendu, nous pouvons également analyser les données et effectuer les opérations correspondantes.

Résumé

Cet article fournit une explication détaillée des opérations AJAX en PHP. L'utilisation de la technologie AJAX peut non seulement améliorer l'efficacité et l'expérience utilisateur des applications Web, mais également permettre un échange de données plus flexible et plus pratique. AJAX est devenu une technologie de développement Web indispensable pour les développeurs PHP, la maîtrise de la technologie AJAX permet de réaliser des applications Web plus efficaces et dynamiques.

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!

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

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Comment déverrouiller tout dans Myrise
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Guide d'installation et de mise à niveau de PHP 8.4 pour Ubuntu et Debian Guide d'installation et de mise à niveau de PHP 8.4 pour Ubuntu et Debian Dec 24, 2024 pm 04:42 PM

PHP 8.4 apporte plusieurs nouvelles fonctionnalités, améliorations de sécurité et de performances avec une bonne quantité de dépréciations et de suppressions de fonctionnalités. Ce guide explique comment installer PHP 8.4 ou mettre à niveau vers PHP 8.4 sur Ubuntu, Debian ou leurs dérivés. Bien qu'il soit possible de compiler PHP à partir des sources, son installation à partir d'un référentiel APT comme expliqué ci-dessous est souvent plus rapide et plus sécurisée car ces référentiels fourniront les dernières corrections de bogues et mises à jour de sécurité à l'avenir.

CakePHP travaillant avec la base de données CakePHP travaillant avec la base de données Sep 10, 2024 pm 05:25 PM

Travailler avec la base de données dans CakePHP est très simple. Nous comprendrons les opérations CRUD (Créer, Lire, Mettre à jour, Supprimer) dans ce chapitre.

Date et heure de CakePHP Date et heure de CakePHP Sep 10, 2024 pm 05:27 PM

Pour travailler avec la date et l'heure dans cakephp4, nous allons utiliser la classe FrozenTime disponible.

Téléchargement de fichiers CakePHP Téléchargement de fichiers CakePHP Sep 10, 2024 pm 05:27 PM

Pour travailler sur le téléchargement de fichiers, nous allons utiliser l'assistant de formulaire. Voici un exemple de téléchargement de fichiers.

Discuter de CakePHP Discuter de CakePHP Sep 10, 2024 pm 05:28 PM

CakePHP est un framework open source pour PHP. Il vise à faciliter grandement le développement, le déploiement et la maintenance d'applications. CakePHP est basé sur une architecture de type MVC à la fois puissante et facile à appréhender. Modèles, vues et contrôleurs gu

CakePHP créant des validateurs CakePHP créant des validateurs Sep 10, 2024 pm 05:26 PM

Le validateur peut être créé en ajoutant les deux lignes suivantes dans le contrôleur.

Journalisation CakePHP Journalisation CakePHP Sep 10, 2024 pm 05:26 PM

Se connecter à CakePHP est une tâche très simple. Il vous suffit d'utiliser une seule fonction. Vous pouvez enregistrer les erreurs, les exceptions, les activités des utilisateurs, les actions entreprises par les utilisateurs, pour tout processus en arrière-plan comme cronjob. La journalisation des données dans CakePHP est facile. La fonction log() est fournie

Comment configurer Visual Studio Code (VS Code) pour le développement PHP Comment configurer Visual Studio Code (VS Code) pour le développement PHP Dec 20, 2024 am 11:31 AM

Visual Studio Code, également connu sous le nom de VS Code, est un éditeur de code source gratuit – ou environnement de développement intégré (IDE) – disponible pour tous les principaux systèmes d'exploitation. Avec une large collection d'extensions pour de nombreux langages de programmation, VS Code peut être c

See all articles