Richfaces + jquery integration

[michele.delprete]

Hi to all,

I'm trying to integrate jquery inside richfaces and I've written this siomple code :

<div xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core" xmlns:a4j="http://richfaces.org/a4j" xmlns:rich="http://richfaces.org/rich">
          <f:view>
                    <f:loadBundle basename="Language" var="msgs" />
                              <ui:composition>
                              <ui:define name="extraHeadContent">
                              <a4j:loadScript src="jquery-1.6.js"></a4j:loadScript>
                              <script type="text/javascript" language="javascript">
                                        //<![CDATA[
                                                  jQuery.noConflict();
                                                  jQuery(document).ready(function() {
                                                            jQuery("#aaa").click(function() {
                                                          alert("Hello world!");
                                                        });
                                                   });
                                        //]]>
                                        </script>
                              </ui:define> 
                                        <a id="aaa" href="">Link</a>
                              </ui:composition>
          </f:view> 
</div>

I've put all in a portlet that run under liferay, but it not works. jquery-1.6.js is in the same folder of my jsp

Thanks

Michele

[michele.delprete]

Sorry, this is the code

<div xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core" xmlns:a4j="http://richfaces.org/a4j" xmlns:rich="http://richfaces.org/rich">

          <f:view>

                    <f:loadBundle basename="Language" var="msgs" />

                              <ui:composition>

                              <ui:define name="extraHeadContent">

                              <a4j:loadScript src="jquery-1.6.js"></a4j:loadScript>

                              <script type="text/javascript" language="javascript">

                                        //<![CDATA[

                                                  jQuery.noConflict();

                                                  jQuery(document).ready(function() {

                                                            jQuery("#aaa").click(function() {

                                                          alert("Hello world!");

                                                        });

                                                   });

                                        //]]>

                                        </script>

                              </ui:define>

                                        <a id="aaa" href="">Link</a>

                              </ui:composition>

          </f:view>

</div>

[ilya_shaikovsky]

RichFaces bunled with jQuery  script and uses as a base dependency. So loading your external one (and with the different version that our internal used) will cause conflicts.

[michele.delprete]

Ok, so I need to load my exetrnal jquery, I have to use the same version of the internal?

In this case I've used 1.6 version, so if I have the internal (example) with 1.5 I have to put

<a4j:loadScript src="jquery-1.5.js"></a4j:loadScript>

                              <script type="text/javascript" language="javascript">

                                        //<![CDATA[

                                                  jQuery.noConflict();

right?

Update :

I've tried but withou success. I've also red the developer's documentation :

http://docs.jboss.org/richfaces/latest_3_3_X/en/devguide/html/rich_jQuery.html

where I've found :

You can use the futures of jQuery directly without defining the <rich:jQuery> component on a page if it is convenient for you. To start using the jQuery feature on the page, include the library into a page with the following code:

...
<a4j:loadScript src="resource://jquery.js"/>
...

Refer to the jQuery documentation for the right syntax. Remember to use jQuery() function instead of $(), as soon as jQuery works without conflicts withprototype.js.

that is exactly what I've done, but no success

I don't understand where is my fault

thanks

Michele