JSF & Java Blog

Discussion on Java and JSF, including Spring, Maven, Eclipse and Jenkins

Newer jQuery with Richfaces


Richfaces 3.3 comes with jQuery 1.3.2 and so you may find you want to use some newer features of jQuery that are only available in a later version. It is actually very easy to use a newer version of jQuery with Richfaces by simply including the newer version and then putting it into noConflict mode and assigning it to a new variable. You can then use the newer jQuery version by referring to your variable name instead of using jQuery.

<script type="text/javascript" src="/script/yourNewJQuery.js"></script>
<script type="text/javascript">
var customJQuery = jQuery.noConflict(true);
customJQuery(function() {
	customJQuery('#divName').on('click', function() { 
		console.log('divName was clicked');

The call to the function ‘on‘ will work in the above scenario as it is using the customJQuery instead of the original jQuery. This assumes the newer jQuery version you included was a version that supports the ‘on’ function.

This method of using a newer jQuery version will work fine for your own custom Javascript code, but issues may occur when trying to use a plugin that also needs to use your newer version. Most of the plugins will expect to be able to call jQuery using the jQuery name. Therefore, you may need to edit any plugin Javascript files and change all references to the jQuery name to your new customJQuery name.

So, what do you think ?

  • *