How to load jQuery plugins AFTER jQuery for Joomla 3.0? - Joomla! Forum - community, help and support

how can include jquery dependent scripts after joomla has loaded jquery?

using jhtml::script() scripts added before joomla's loading of jquery causing javascript error. work-around using "echo" include scripts allow several modules on same page must include on top-most 1 don't know is...

there must way round using jhtml::script or similar, right?

regards,
anders

jhtml::script() adds javascript array processed in first in/first out order.

therefore if further on in process decides needs jquery, jquery added then.

for jquery, use:

code: select all

jhtml::_('jquery.framework',  true, true);
followed plugins:
// plugin located @ _basepath/js
jhtml::_('script',$this->_basepath.'jquery.plugin.js', false, true, false, false);


for jquery-ui can skip call framework, ui automatically add framework before calls itself:
ie

code: select all

// joomla jquery ui consists of
// core, widget, mouse, , position
// sortable included seperate module
// pass core or sortable or both in array specify ones
jhtml::_('jquery.ui',  array('core', 'sortable'), true);
// button ui can problematic!
jhtml::_('script',$this->_basepath.'jquery.ui.button.js', false, true, false, false);

finally, if including bootstrap framework, load jquery bootstrap

code: select all

jhtml::_('bootstrap.framework');
// plugin located @ _basepath/js
jhtml::_('script',$this->_basepath.'jquery.plugin.js', false, true, false, false);

note: bootstrap , jquery-ui buttons plugin have known conflicts. whichever file loaded last 1 used. ie:
finally, if including bootstrap framework, load jquery bootstrap

code: select all

jhtml::_('bootstrap.framework');
// joomla jquery ui consists of
// core, widget, mouse, , position
// sortable included seperate module
// pass core or sortable or both in array specify ones
jhtml::_('jquery.ui',  array('core', 'sortable'), true);
// button ui can problematic!
jhtml::_('script',$this->_basepath.'jquery.ui.button.js', false, true, false, false);


jquery-ui button button module in use, bootstrap javascript disabled

code: select all

// joomla jquery ui consists of
// core, widget, mouse, , position
// sortable included seperate module
// pass core or sortable or both in array specify ones
jhtml::_('jquery.ui',  array('core', 'sortable'), true);
// button ui can problematic!
jhtml::_('script',$this->_basepath.'jquery.ui.button.js', false, true, false, false);
jhtml::_('bootstrap.framework');

bootstrap button code active, jquery-ui button disabled.

to both work apps, load bootstrap, ui, buttons, , modified bootstrap button script different function names.
https://gist.github.com/4177778