Prestashop : comment corriger probleme ajax sur la pagination ?

Prestashop : Vérifier les erreurs JavaScript dans la console

Un problème de pagination AJAX peut être dû à une erreur JavaScript empêchant l’exécution du script lié à la navigation. Cela bloque l’interaction avec les boutons de changement de page.

Ouvre la console navigateur (F12 > Console) et clique sur une page dans la pagination. Si une erreur apparaît (ex : Uncaught TypeError), elle interrompt la fonction AJAX qui met à jour la liste de produits sans rechargement.

Prestashop : Contrôler le bon chargement des scripts

Si les fichiers JavaScript responsables de la pagination dynamique ne sont pas correctement chargés, la fonctionnalité AJAX échoue. Cela peut être causé par un mauvais hook ou un conflit de thème.

Assure-toi que les fichiers comme facetedsearch.js sont bien appelés dans le front (displayHeader). Prestashop a besoin de ces scripts pour exécuter les changements de page via AJAX, sans rechargement complet du catalogue produit.

Prestashop : Tester avec le thème Classic

Les thèmes personnalisés modifient souvent la structure HTML ou la logique JS de la pagination, ce qui empêche le fonctionnement AJAX standard. Le script ne retrouve pas les éléments attendus.

Active temporairement le thème Classic dans Apparence > Thème & Logo. Si la pagination fonctionne avec ce thème, le souci vient de ton template personnalisé. Il faudra adapter les classes et identifiants HTML aux attentes de Prestashop.

Prestashop : Vider le cache Smarty et navigateur

Un cache corrompu ou un JavaScript périmé peut empêcher la pagination AJAX de se lancer ou de s’exécuter jusqu’au bout. Cela provoque un comportement bloqué ou inactif.

Va dans Paramètres avancés > Performance, clique sur "Vider le cache". Ensuite, recharge la page avec Ctrl + F5. Cela force Prestashop à servir les fichiers JS à jour, nécessaires pour le bon fonctionnement du système de pagination AJAX.

Prestashop : Vérifier les appels AJAX dans l’onglet Réseau

Ouvre les outils développeur (F12 > Réseau) et filtre les requêtes XHR. Lorsque tu cliques sur une page de la pagination, une requête AJAX doit apparaître.

Si aucune requête ne se déclenche, le script n’est pas exécuté. Si une requête apparaît mais retourne une erreur 500 ou un contenu vide, vérifie les fichiers PHP appelés. Prestashop s’appuie sur une réponse JSON ou HTML valide.

Prestashop : Vérifier la compatibilité du module de navigation à facettes

Le module Navigation à facettes (facetedsearch) gère la pagination AJAX dans les catégories. Une version obsolète ou mal configurée peut entraîner des bugs de chargement de pages.

Va dans Modules > Gestion des modules, mets à jour Faceted Search, puis vérifie ses options (notamment l’activation de l’AJAX dans les filtres). Prestashop utilise ce module pour construire la pagination sans rechargement.

Prestashop : Contrôler la structure HTML de la pagination

Les éléments de pagination doivent avoir des attributs spécifiques (data-url, pagination-selector, classes CSS...) pour que le script AJAX les détecte. Si ces balises sont modifiées, la fonction JS ne réagit pas.

Inspecte le code HTML généré dans le front-office. Compare-le avec le thème Classic pour vérifier que Prestashop peut cibler les bons liens de pagination pour déclencher la mise à jour AJAX.

Prestashop : Désactiver les modules qui perturbent le DOM

Des modules tiers (bannières, outils SEO, effets visuels) peuvent modifier le DOM après chargement, empêchant le script AJAX de détecter ou réinitialiser la pagination.

Désactive temporairement les modules non essentiels liés au catalogue ou à l’affichage, puis teste la navigation. Si Prestashop retrouve son comportement normal, il faudra ajuster les scripts de compatibilité dans le thème.

Prestashop : Réinitialiser ou réinstaller le module concerné

Si le module de pagination AJAX est corrompu (ex. navigation à facettes), une réinitialisation peut restaurer le bon fonctionnement, sans toucher aux données.

Dans Modules > Faceted Search, clique sur "Réinitialiser", puis vérifie que l’option "Recharger les produits en AJAX" est activée. Cela permet à Prestashop d’utiliser la structure par défaut, sans interférence de scripts personnalisés.

Prestashop : Utiliser l’événement JavaScript pour recharger les composants

Après chaque changement AJAX, certains éléments comme les filtres, boutons ou classes actives doivent être réinitialisés. Si le script ne le fait pas, la pagination bugge au clic suivant.

Utilise l’événement renderedFacets de Prestashop pour réinitialiser les listeners ou recharger certains éléments. Cela garantit que chaque nouvelle page affichée en AJAX reste interactive et cohérente avec le comportement attendu.