Joomla, Ajax, jQuery: tips and tricks

Quando un sito ha interazioni con Ajax (parliamo di una pagina che carica del contenuto html e lo inserisce dinamicamente nel proprio markup) è possibile che alcune risorse vengano caricate più volte.

Normalmente questo non causa particolari problemi, né rallentamenti visto che il browser le terrà in cache.

Nel caso di fogli di stile, l'unico "fastidio" che avremo sarà trovare più volte una regola in firebug.

Nel caso degli script, tuttavia, può succedere di ricaricare una libreria importante come jQuery.  Fin qui niente di male, il problema sorge però nel momento in cui iniziamo ad usare plugin per jQuery, ad esempio lightbox, colorbox, tipTip, placeholder ecc., che dal momento della chiamata Ajax in poi non funzioneranno più.

Cosa succede: la pagina principale conterrà

jQuery.js
jQuery.colorbox.min.js
jQuery.otherplugin.js

La pagina "caricata" invece contiene:

jQuery.js

perché il suo contenuto non ha richiesto l'inserimento delle altre librerie.

A questo punto, quando la pagina chiamante, a seguito di qualche altra interazione, decide di invocare la libreria colorbox, lo farà su una nuova versione di jQuery che NON HA il colorbox!!!

Data e ora: 12/12/2012 15:31:42
Errore: TypeError: jQuery.fn.placeholder is not a function
File sorgente: http://test.com/ziggy.html
Riga: 904

Come risolvo la situazione?

Assicurandomi che jQuery venga caricato una volta sola.

Ok, dimmi di più

Le chiamate ajax per generare html possono esser fatte con un'invocazione speciale di Joomla, aggiungendo un parametro:

...&tmpl=component  che include gli script e le dichiarazioni

...&format=raw   che contiene solo l'output del componente (normalmente usato per chiamate a dati "puri", non html formattato)

Nel secondo caso non includiamo script, quindi il problema non si pone.  Se il vostro componente non include script, potete usare questo approccio.

Il primo caso invece è generato usando il file component.php nella cartella del vostro template: quindi la soluzione (molto manuale) è di aprire questo file e

a) se è caricato jQuery esplicitamente, provate a toglierlo

b) se non è caricato, vuol dire che è un componente/modulo/plugin ad inserirlo; dovrete quindi

b.1) inserirlo manualmente nell'index.php

b.2) trovare l'estensione che lo inseriva e rimuovere la sua dichiarazione.