« Programmation JavaScript/Ajax » : différence entre les versions

Un livre de Wikilivres.
Contenu supprimé Contenu ajouté
Page redirigée vers Programmation PHP/Ajax/Sommaire
 
Redirection supprimée vers Programmation PHP/Ajax/Sommaire
Balise : Redirection supprimée
Ligne 1 : Ligne 1 :
<noinclude>{{Programmation JavaScript}}</noinclude>
#REDIRECT[[Programmation_PHP/Ajax/Sommaire]]

AJAX signifie "''Asynchronous Javascript And Xml''", soit « Javascript asynchrone et Xml » en français.
Il s'agit d'un moyen de charger le contenu retourné par un serveur web (resource, fichier, ...) depuis le javascript.
Cela permet notamment de recharger une partie de l'interface web sa,s recharger toute la page.

== Exemple ==

<syntaxhighlight lang="javascript">
function createXhrObject()
{
if (window.XMLHttpRequest)
return new XMLHttpRequest();

if (window.ActiveXObject)
{
var names = [
"Msxml2.XMLHTTP.6.0",
"Msxml2.XMLHTTP.3.0",
"Msxml2.XMLHTTP",
"Microsoft.XMLHTTP"
];
for(var i in names)
{
try{ return new ActiveXObject(names[i]); }
catch(e){}
}
}
window.alert("Votre navigateur ne prend pas en charge l'objet XMLHTTPRequest.");
return null; // non supporté
}

function updatePage(contentpath)
{
let xhr = createXhrObject();
xhr.onreadystatechange = function()
{
if (xhr.readyState == 4 && xhr.status == 200)
document.getElementById('cadre_contenu').innerHTML = xhr.responseText;
}
xhr.open("GET", "load.php?page="+contentpath, true);
xhr.send(null); // Envoi avec données (typiquement pour une requête POST seulement, null pour GET).
}
</syntaxhighlight>

Version du 20 décembre 2020 à 14:18

AJAX signifie "Asynchronous Javascript And Xml", soit « Javascript asynchrone et Xml » en français. Il s'agit d'un moyen de charger le contenu retourné par un serveur web (resource, fichier, ...) depuis le javascript. Cela permet notamment de recharger une partie de l'interface web sa,s recharger toute la page.

Exemple

function createXhrObject()
{
    if (window.XMLHttpRequest)
        return new XMLHttpRequest();

    if (window.ActiveXObject)
    {
        var names = [
            "Msxml2.XMLHTTP.6.0",
            "Msxml2.XMLHTTP.3.0",
            "Msxml2.XMLHTTP",
            "Microsoft.XMLHTTP"
        ];
        for(var i in names)
        {
            try{ return new ActiveXObject(names[i]); }
            catch(e){}
        }
    }
    window.alert("Votre navigateur ne prend pas en charge l'objet XMLHTTPRequest.");
    return null; // non supporté
}

function updatePage(contentpath)
{
    let xhr = createXhrObject();
    xhr.onreadystatechange = function()
    {
        if (xhr.readyState == 4 && xhr.status == 200)
           document.getElementById('cadre_contenu').innerHTML = xhr.responseText;
    }
    xhr.open("GET", "load.php?page="+contentpath, true);
    xhr.send(null); // Envoi avec données (typiquement pour une requête POST seulement, null pour GET).
}