dynAJAX
est un pluggin JQuery permettant de simplifier l'utilisation de AJAX.
dynAjax
, c'est aujourd'hui 4 fonctions Jquery :
fonction $jQuery.dynajax();
<div> <a ajax='on' ajax_hash='off' href='mon.cgi'>un simple lien</a> </div>
<script> $('body').dynajax(); </script>
La div parent du lien recevra le contenu de l'appel à mon.cgi.
La fonction parcourt le DOM à la recherche de tag A avec l'attribut ajax='on',
puis fait un appel AJAX sur le lien fourni dans le tag A (en ajoutant
&AJAX=on
pour pouvoir donner des contenus spécifiques).
La fonction est utilisée partout sur lantranet pour rechercher les cadres des blogs, les quiz, etc...
J'ai consacré un article entier à la méthode d'utilisation de dynajax(). Vous trouverez dans celui-ci toutes les informations utiles à la compréhension de la façon dont l'AJAX est géré sur les sites de LantraNet.
fonction $jQuery.ajax_update();
ajax_update();
permet de mettre en place un appel ajax pour mettre a jour une node text, aussi bien côté serveur que sur la page HTML.
<a href='update.pl' class='ajax_update'>La valeur a modifier</a>
<script> $('a.ajax_update').ajax_update(); </script>
Si l'on click sur le tag A, on fait apparaittre un champ text on l'on peut modifier le texte.
Si l'on valide la modification, "update.pl?VALUE=La+nouvelle+valeure" sera appelé.
Si update.pl renvoi OK, la valeur sera mis à jour dans la page, sinon une alert() avec le texte renvoyé sera affichée.
On entoure le tag A et les INPUT text button submit d'un FORM.ajax_update pour la CSS.
fonction $jQuery.ajax_delete();
ajax_delete();
permet de mettre en place un appel ajax pour supprimer un objet, aussi bien côté serveur que sur la page HTML.
<li id='mon_objet'><a ajax_delete='#mon_objet' href='delete.pl'>supprimer</a></li>
<script> $('a[ajax_delete]').ajax_delete(); </script>
Si l'on click sur le tag A, une demande de confirmation de suppression apparaît.
Si l'on confirme la suppression, "delete.pl" est appelée en AJAX.
Si delete.pl renvoi OK, la node HTML dont l'id est "mon_objet" est supprimé.
Si delete.pl ne renvoi pas OK, le texte renvoyé est afficher dans une boite d'alerte.
Pour permettre de mettre en place un système de suppression fonctionnant sans JavaScript, dynajax ajoute un argument AJAX=on à la fin de delete.pl. Ainsi, on pourra mettre en place une solution alternative (côté serveur) pour qu'à la place de renvoyer OK affiche une page HTML ou que l'on fasse une redirection.
fonction $jQuery.ajax_select();
ajax_select();
pertmet de remplir les options d'un <SELECT> à partir d'une requête AJAX.
Elle s'utilise ainsi :
<form>
<select name='PAYS' ajax_select='on' ajax_url='mespays.cgi'>
<option value=''>Choisissez </option>
</select>
</form>
<script>
$('select[ajax_select=on]').ajax_select();
</script>
L'attribut ajax_select
ne sert ici qu'a la selection des object SELECT sur lequels lancer la fonction.
L'attribut ajax_url
est obligatoire est contient l'URL a appeler pour récupérer les données
Les données sont de simple ligne de texte (l'URL peut pointer sur un fichier TXT) chaque ligne étant inséré les unes à la suite des autres dans le SELECT (la value et le texte affiché étant identique).
Si les lignes de donnée contiennent un caractère tabulation, celui-ci sert de séparateur de champ, le premier champ étant la value et le deuxième étant le texte apparaîssant dans la liste.
Les données peuvent donc ressemblées à :
France Belgique Italie Allemagne
Les options du select aurons leurs values égale au texte sélectionné. Donc si l'utilisateur sélectionne la
France, c'est la chaîne de caractères France
qui sera envoyé au script serveur sous la forme :
PAYS=France
.
Ou si l'on désire que la value diffère du texte :
FR France BE Belgique IT Italie DE Allemagne
Ainsi, si l'utilisateur sélectionne la France, c'est le code ISO-3166 sur 2 caractères FR
qui sera fournit
par le formulaire au script serveur sous la forme PAYS=FR
.