Comment faire une requête Ajax en Post sans jQuery ?

Question

Comment faire une requête Ajax avec la méthode Post sans utiliser jQuery ?

Answer 1

Pour effectuer un appel Ajax, avec la méthode Post, sans jQuery, vous devez utiliser les objets XMLHttpRequest.

Lors de l'envoi d'une requête Ajax avec la méthode Post, vous devez définir manuellement le type de contenu dans les en-têtes de la requête :

application/x-www-form-urlencoded 

x-www-form-urlencoded permet d'envoyer les données sous la forme de paramètres d'URL.

Voici un exemple d'appel Ajax, sans jQuery, avec la méthode Post et l'objet XMLHttpRequest :

<script>
var ajax = new XMLHttpRequest();
ajax.onreadystatechange = function () {
    if (this.readyState == 4) {
        alert('Réponse de la requête AJAX : ' + this.response);
    }
};
ajax.open('POST', 'ajax.php', true);
ajax.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
ajax.send('pass=1formatik');
</script>

Remarque : Pour envoyer plusieurs Post, utilisez le caractère & comme séparateur.

http.send('pass=1formatik&nom=ted');

Voici le contenu du fichier ajax.php ; il vérifie que la valeur du Post nommé pass est bien égale à 1formatik :

<?php
if ((isset($_POST['pass'])) && ($_POST['pass'] == '1formatik')) {
echo "mot de passe correct";
}
else echo "mot de passe faux";
?>

Remarque : Vous trouverez la signification des valeurs d'état readyState via cette page du site de Mozilla.