La rumeur court sur la planète Webdesign, il paraît que le futur des applications Web passera peut-être par "Ajax". Mais que se cache t'il donc derrière ce nom de produit ménager ?! En tout cas mon avis est fait après quelques lectures non dénuées d'intérêts et quelques mises en applications des exemples donnés : c'est sans doute vrai qu'une petite révolution est en marche !

Google Mail ou encore Google Suggest, par exemple, sont déjà basés sur ce système et le nombre de sites qui utilisent cette technologie ne fait qu'augmenter de jour en jour.

C'est vrai qu'à la vue des possibilités offertes par ce système on peux imaginer beaucoup de mise en pratique. Avant d'en arriver là, voici un article que Bruno m'avait signalé et qui résume très bien le mode de fonctionnement des applications Web utilisant cette technologie. Si vous n'êtes pas un parfait bilingue, je vous conseille quand même de vous attarder sur le schéma explicatif...

Après avoir lu cet article, vous voudrez bien évidement connaître toutes les possibilités offertes par Ajax, et vous y essayer. C'est là qu'un petit tour dans la partie "demo" du site consacré à OpenRico - Une classe justement à cette fabuleuse technologie - vous permettra définitivement d'être convaincu que vos applications vont s'enrichir de cette nouveauté !

De mon côté, après l'avoir très modestement éprouvée sur le moteur de recherche par référence du site de La Crosse Technology, j'ai récidivé sur Theatre-contemporain.net.

Je me suis déjà attaqué à la page des éditeurs. Pour cet exemple, j'ai utilisé la classe découverte sur ce blog de qwix trouvé par hasard et qui semble être le fait d'un blogueur bisontin. Je vous livre donc tel quel, brut de décoffrage, le bout de source qui va bien :

Quelques extrait de la page qui contient la liste nominative :

// appel à la classe
// fonction javascript
<script type="text/javascript" language="javascript">
    function chargeFichier(id) {
        // Création de l'objet
        var XHR = new XHRConnection();
        // Zone a remplir
        XHR.setRefreshArea('zonedetail'+id);
        // Chargement de la page
        XHR.sendAndLoad("details-editeur.php?idedit="+id, "GET");
        return true;
    }
</script>
<?php
// boucle depuis la base de données
    while ($row = $result->fetchRow()) {
        $country =& $db->getOne("SELECT ".$lang." FROM ".$table_paysth." WHERE id='".$row['country']."' ");
            echo "<li><a href=\"javascript:;\" onclick=\"chargeFichier(".$row['id'].");\">".$row['organisation']."</a> - ".$row['city']." (".$country.")";
            echo "<div id=\"zonedetail".$row'id'."\"></div>";
            echo "</li>";
    }
... ect
?>

Extrait de la page qui contient les détails :

<?php
 echo "<div class=\"maisonseditions\">";
       echo "<div style=\"font-size: 10px; text-align: right;\"><a href=\"javascript:;\" onclick=\"document.getElementById('zonedetail".$row'id'."').innerHTML = '';\">x
fermer</a></div>";
... ici les infos détaillées ....
       echo "</div>";
?>

Pour être sur que tout le monde à compris : la page editeurs.html ne charge que la liste nominative. Ensuite chaque clic sur le nom d'un éditeur fait appel au données le concernant. Léger et efficace, seulement quelques octets de données sont appelés à chaque fois depuis le serveur.

Sur ma lancée, j'ai aussi utilisé Ajax sur la page du calendrier afin d'éviter de charger les importantes et longues listes déroulantes du moteur de recherche avancé à chaque chargement de la page "calendrier" (couplé à un système de cache c'est bien rapide).

Alors pas convaincu par l'intitulé de l'article cité plus haut : "Ajax: A New Approach to Web Applications" ?