-
1. Re: jQuery plugins and richfaces
mail.micke Jul 15, 2008 12:49 PM (in response to mail.micke)Solved. I think, at least now I got some action.
Turns out some dimensions js file is needed, wasn't listed as a dependency and strangely enough I think the Dialog stuff worked in plain html test I did...
-micke
-
2. Re: jQuery plugins and richfaces
andrey.chorniy Aug 26, 2008 5:02 PM (in response to mail.micke)Hi Mikael, I'm trying to do just the same, but I was failed to use jquery.ui plugin for tabs (I add the dimensions plugin also)
Please, could you describe the changes which you performed to make it working ?
Are you changed the jquery.ui plugin javascript in some way?I use richfaces 3.1.4 - maybe the problem is in richfaces version ?
-
3. Re: jQuery plugins and richfaces
mail.micke Aug 26, 2008 5:51 PM (in response to mail.micke)Hi
The tabs just worked for me.
Here is my xhtml which worked fine with tabs, hopefully this will help.
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:a4j="https://ajax4jsf.dev.java.net/ajax" xmlns:rich="http://richfaces.ajax4jsf.org/rich" xmlns:s="http://jboss.com/products/seam/taglib" template="/WEB-INF/layout/template.xhtml"> <ui:param name="title" value="JQuery tabs"/> <ui:define name="extraHeaderContent"> <a4j:loadStyle src="/js/jquery/themes/flora/flora.all.css"></a4j:loadStyle> <a4j:loadScript src="/js/jquery/ui/jquery.ui.all.js" /> <style> </style> <script language="JavaScript"> jQuery(document).ready(function(){ jQuery("#example > ul").tabs(); }); </script> </ui:define> <ui:define name="body"> <div id="example" class="flora"> <ul> <li><a href="#fragment-1"><span>One</span></a></li> <li><a href="#fragment-2"><span>Two</span></a></li> <li><a href="#fragment-3"><span>Three</span></a></li> </ul> <div id="fragment-1"> <p>First tab is active by default:</p> <pre><code>$('#example > ul').tabs();</code></pre> </div> <div id="fragment-2"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </div> <div id="fragment-3"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </div> </div> </ui:define> </ui:composition>
-
4. Re: jQuery plugins and richfaces
andrey.chorniy Aug 26, 2008 7:58 PM (in response to mail.micke)Thank you Mikael, it works for me but for 3.2.0 richfaces, unfortunately my project use 3.1.4 and we can't switch to 3.2.0
Hope some workaround exists, possibly I have to modify plugin javascript.. -
5. Re: jQuery plugins and richfaces
ramanujareddy Feb 25, 2009 10:37 AM (in response to mail.micke)thank you ..can u give the code of jquery.ui.all.js, flora.all.css please..
-
6. Re: jQuery plugins and richfaces
thomas.modeneis Jul 13, 2009 1:30 AM (in response to mail.micke)Hey man,
you can just do it:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:a="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich">
<script>
var $j = jQuery.noConflict();
$j(document).ready(function(){
alert('oi');
$j('username').value('');
$j('username').focus();
});
</script>
</html> -
7. Re: jQuery plugins and richfaces
thomas.modeneis Jul 13, 2009 1:58 AM (in response to mail.micke)i forget something,
you have to add this:<a:loadScript src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js" />
on same page where you want to make jquery call.
good job 4 all us.
-
8. Re: jQuery plugins and richfaces
chris.simons Jul 13, 2009 4:33 PM (in response to mail.micke)It is true in more recent versions of RichFaces that jQuery is bundled with the libraries.
Therefore, to use jQuery I only have to do the following:
<a4j:loadScript src="resource://jquery.js" />
Next, if I have a plugin to include, such as the great meio mask:
<script type="text/javascript" src="#{facesContext.externalContext.requestContextPath}/js/jquery.meio.mask.min.js"/>
Then, to use jQuery within Javascript, I do, for example:
<script type="text/javascript"> jQuery(document).ready(function() { jQuery.mask.masks = jQuery.extend(jQuery.mask.masks, { ssn: { mask: '999-99-9999', autoTab: false } }); // call setMask function on the document.ready event jQuery('input:text').setMask(); }); </script>
-
9. Re: jQuery plugins and richfaces
brunoac88.bj.carneiro.gmail.com May 25, 2010 12:58 PM (in response to mail.micke)Hi Folks,
I'm trying to use a jQuery plugin in a RichFaces and jBoss Seam project.
I saw this topic here, and I tried to do all the solutions listed, but none I got the result.
The problem is, RichFaces scripts use '$' character, and jQuery plugin too. So there is a conflict.
Here is my code. How can I solve this problem?<a4j:loadStyle src="../../plc/css/cloud-zoom.css"></a4j:loadStyle> <a4j:loadScript src="resource://jquery.js" /> <a4j:loadScript src="../../plc/javascript/cloud-zoom.1.0.1.min.js"></a4j:loadScript> <!--I use the jQuery plugin throw the style-class --> <h:commandLink value="#{plcEntidade.imagem}" styleClass="cloud-zoom" id="zoom1" rel="adjustX: 10, adjustY:-4"> <h:graphicImage value="#{produto.imagem}" width="250" height="250" /> </h:commandLink>
Thanks in advance.
-
10. Re: jQuery plugins and richfaces
chris.simons May 25, 2010 2:56 PM (in response to mail.micke)As the thread above shows, you have to use
jQuery
in-place of$
because of the conflict you mention.It should work.
-
11. Re: jQuery plugins and richfaces
boomerbrian.brian.abston.featurenotbug.com May 25, 2010 2:59 PM (in response to mail.micke)Like Chris mentioned you can't use $(). You have to use JQuery(). $() is used to refer to prototype.js functions which RichFaces uses heavily.