Javascript Errors

Nowadays almost every Joomla extension uses JavaScript to create a more responsive website for a better user exprience. Mostly all JavaScripts rely on a JavaScript library like jQuery, Mootools or others. Using different scripts on a webpage can cause conflicts between them. This tutorial helps you to detect and resolve these script errors.

How to detect errors?

If your website does not work as you expect when you click something or an animation stopped working, this could be the result of a script error. In case of an error the script-execution will be stopped by the browser. While some pages might still work, others don't. Not every script is being loaded on every single page of your website. A way to investigate these errors is to use the browser's debug console on the page where the error occurs. In Firefox you can use the Firebug Addon, other browsers like Chrome, Safari or Opera already have similar tools built-in. These developer tools will show you the script-errors including information about what went wrong, the file and line number, and the line of source code that caused the error. This will really help you with debugging any script errors.

How to resolve errors?

If you've detected a JavaScript error on a page you need to find its origin. Usually the errors are caused by an extension or combination of multiple extensions. The browser's debug console will help you to identify the scripts and their related files on your webserver. Once you have identified the extension you can try disabling it to make sure your page works without any errors again. If the error is gone, you've found the extension causing the conflict. Now you can look for the extensions configuration option and see if it lets you enable/disable loading a JavaScript library like jQuery to resolve the errors.

How to prevent loading jQuery multiple times?

There is an ongoing discussion in the Joomla community on how to prevent loading jQuery multiple times across extensions. We have already taken steps and measures by implementing a widely accepted solution. We register through JApplication whether jQuery is loaded or not. In case a 3rd party extension loads the jQuery library you can use the following code snippet to prevent our ZOO extension, Widgetkit or Warp theme from loading it twice:

// load jQuery, if not loaded before
if (!JFactory::getApplication()->get('jquery')) {
	JFactory::getApplication()->set('jquery', true);
	// add jQuery
	...
}

You can also get in touch with the 3rd party extension developer and kindly ask them to implement this.

Useful Links

Documentation on Github

Help us out! If you are feeling that our documentation has errors or can be improved, fork it at Github and send us a pull request. Any contribution is much appreciated. Thank you!