Kevin's Papers

Technical Papers by Kevin Morrison

Font size: +
2 minutes reading time (450 words)

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 jQueryMootools or others. Using different scripts on a webpage can cause conflicts between them. This tutorial helps you to detect and resolve these script 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.


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.


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.


Stay Informed

When you subscribe to the blog, we will send you an e-mail when there are new updates on the site so you wouldn't miss them.

How to Layout Your Articles for Your Website
It Only Takes One