Commentaire n°2169 par Galdon

Auteur :	:	Galdon
Pays	:	FRANCE
Date	:	jeudi 22 mars 2012, 16:53
Commentaire	:	Ah Ben c'est pas très compliqué, quand l'utilisateur utilise le filtre (choix d'une marque, utilisation des sliders prix ou capacité...), j'envoi une requête AJAX (en GET) avec jQuery : function submitForm(){ $.ajax({ url: "/etc/ajax-comparateur.php", type: "GET", data: ({ id_marque: $("#marque").val(), prix_min : $("#prix").slider("values", 0), prix_max : get_prix_max(), capacite : $("#capacite").slider("value"), format : $("#format").val() }), dataType: "html", complete: function(data){ $('.pagination').hide(); $("#comparateur tbody").empty(); $("#comparateur tbody").append(data.responseText); } }); } Ca envoi une requête de ce style sur le serveur : Exemple d'une recherche des SSD intel format 1.8 pouces : [...] ajax-comparateur.php?id_marque=4&prix_min=0&prix_max=unlimited&capacite=0&format=1.8 Donc dans le script PHP je récupère les variables GET comme d'habitude, via le tableau $_GET : $id_marque = $_GET['id_marque']; $prix_min = $_GET['prix_min']; $prix_max = $_GET['prix_max']; $capacite = $_GET['capacite']; $format = $_GET['format']; Après j'utilise ces variables pour construire une requête SQL qui me retourne la liste des modèles de SSD qui correspondent aux conditions, et j'envoi au client (le navigateur) directement le code html du tableau qui présente les résultats : <tr> <td class="tdlien" width="110" onclick="location.href='/comparateur/avis/intel-x18-m-80go-postville'"> <img src="/ressources/comparateur/ssd_2_mini.jpg" width="100" alt="Intel X18-M 80 Go " /> </td> [...] </tr> Quand je récupère ça côté client (slot `complete:`), je remplace le contenu du <table> par les nouveaux résultat (c'est le empty() et le append() que tu peux voir dans ma fonction submitForm()). Cette méthode qui consiste à retourner directement du HTML à une requête AJAX n'est pas très "propre", idéalement ça serait mieux que le serveur retourne juste les données (encodé en JSON par exemple), au lieu de retourner les de l'HTML qui contient à la fois les données et la mise en forme, mais elle a le mérite d'être plus rapide et facile à mettre en oeuvre, y'a pas besoin de traiter le JSON côté client pour mettre à jour la page.