Débuter avec ajax

Exemple jQuery simple pour communiquer avec le serveur

Extrait du site Web [jQuery.ajax API][1] :

$.ajax({
    method: "POST",
    url: "some.php",
    data: {
        name: "John",
        location: "Boston"
    },
    success: function(msg) {
        alert("Data Saved: " + msg);
    },
    error: function(e) {
        alert("Error: " + e);
    }
});

Ce morceau de code, dû à jQuery, est facile à lire et à comprendre ce qui se passe.

  • $.ajax - ce bit appelle la fonctionnalité ajax de jQuery.

  • method: "POST" - cette ligne déclare ici que nous allons utiliser une méthode POST pour communiquer avec le serveur. Renseignez-vous sur les types de demandes !

  • url - cette variable déclare où la requête va être ENVOYÉE. Vous envoyez une demande À quelque part. C’est l’idée.

  • data - assez simple. Il s’agit des données que vous envoyez avec votre demande.

  • success - cette fonction ici vous écrivez pour décider quoi faire avec les données que vous récupérez msg ! comme le suggère l’exemple, il crée actuellement une alerte avec le msg qui est renvoyé.

  • error - cette fonction ici vous écrivez pour afficher des messages d’erreur, ou pour fournir des actions pour fonctionner lorsque la requête ajax a rencontré des erreurs.

  • une alternative à .done est

    success: function(result) {
        // do something
    });
    

[1] : http://api.jquery.com/jquery.ajax/

Installation ou configuration

Qu’est-ce qu’AJAX ?


AJAX signifie JavaScript asynchrone et XML. En un mot, c’est l’utilisation de l’objet XMLHttpRequest pour communiquer avec le serveur scripts. Il peut envoyer et recevoir des informations dans une variété de formats, y compris JSON, XML, HTML et même des fichiers texte. -Réseau de développeurs Mozilla 2016

Le moyen le plus simple d’implémenter AJAX, en particulier si vous envisagez de communiquer avec des serveurs, consiste à utiliser jQuery.

Qu’est-ce que jQuery ?


jQuery est une bibliothèque JavaScript rapide, petite et riche en fonctionnalités. Cela fait des choses comme la traversée et la manipulation de documents HTML, la gestion d’événements, animation, et Ajax beaucoup plus simple avec une API facile à utiliser qui fonctionne sur une multitude de navigateurs. -jquery.com

Pour ceux qui n’ont pas beaucoup utilisé jQuery, considérez-le comme des fonctions que nous pouvons utiliser pour nous faciliter la vie. C’est parfait pour une utilisation avec AJAX car cela réduit la quantité de code que nous devons écrire pour accomplir la même chose !

Comment ajouter jQuery à votre site Web

Si vous devez utiliser Ajax, vous devez ajouter jQuery à votre projet. http://jquery.com/download/ Dans ce lien, vous pouvez voir de nombreuses façons d’ajouter jquery. Vous pouvez utiliser la version téléchargée de jQuery ou vous pouvez utiliser un CDN. http://jquery.com/download/#jquery-39-s-cdn-provided-by-maxcdn. Mais il existe un risque de sécurité si vous utilisez CDN. Parce que le projet appelle à utiliser jquery, un pirate informatique pourrait donc manipuler l’appel. Donc mieux si vous pouviez utiliser la version téléchargée. Voyons comment ajouter jquery au projet html. C’est facile. Le premier exemple consiste à utiliser la source téléchargée. Utilisez ce lien pour http://jquery.com/download/#jquery download. Si vous souhaitez simplement utiliser jquery, je vous suggère de télécharger ** Télécharger le jQuery de production compressé 3.1.1 ** Lorsque vous le téléchargez, ajoutez jquery-version.min.js à l’endroit approprié (comme le dossier javascript de votre projet) Ensuite, ajoutez simplement la balise