JavaScript errors

Learn, how to handle JavaScript issues and prevent errors.

Almost every Joomla extension uses JavaScript, relying on a library like jQuery. Using different scripts on a webpage can cause conflicts between them.

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 due to a script error. In this case the script execution will be stopped by the browser.

The following developer tools show you script-errors including information about what went wrong, the file and line number and the source code that caused the error.

Developer Tools Description
Browser Debug Console One way is using the browser's debug console on the page where the error occurs. It will help you to identify the scripts and their related files on your webserver.
Firebug and other browser WDT Firebug for Firefox allows you to inspect and non-destructively edit HTML and also includes a powerful JavaScript debugger. Other browsers like Chrome, Safari or Opera already have similar built-in tools.

How to resolve errors?

Usually the errors are caused by an extension or combination of multiple extensions. If you've detected a JavaScript error on a page, you need to find its origin.

  1. Once you have identified the extension, try to disable it to make sure your page works without any errors again.
  2. If the error is gone, you've found the extension causing the conflict.
  3. 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.

Prevent loading jQuery multiple times in Joomla 2.5?

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
    ...
}

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

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!