2 Replies Latest reply on Apr 29, 2009 8:16 AM by ronanker

    How to use the jQuery funtion?

    dxxvi Feb 16, 2009 11:29 AM

      I'm using RF 3.3.0.GA. This is the xhtml page:

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html 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:rich="http://richfaces.org/rich"
 xmlns:a4j="http://richfaces.org/a4j">
<head>
 <script type="text/javascript" src="js/jquery.corners.js"></script>
 <script type="text/javascript">
 //<![CDATA[
 function makeRoundedJs() {
 alert("Hi there!");
 jQuery(".rounded").corners();
 }
 //]]>
 </script>
</head>
<body style="background-color: #8833FF;">
<f:view>
<h:panelGroup layout="block" styleClass="rounded {9px}" id="id1"
 style="padding: 9px; background-color: #FFEEAA; width: 400px; border: 1px solid red;
 margin: 0 auto;">
 This is the home.<br/>
 <a4j:form>
 <a4j:commandLink value="Click here" action="#{nothing.doNothing}" onclick="makeRoundedJs();"/>
 <h:outputText value=" to do nothing in the log file."/>
 </a4j:form>
</h:panelGroup>

<rich:jQuery query="corners()" selector=".rounded" timing="onload"/>
</f:view>
</body>
</html>

      The corners() method will make div's corners rounded. If I have the <rich:jQuery> tag at the end of the page, then the div's have rounded corners. But if I don't, and click on the <a4j:commandLink> to call a javascript function which in turn calls jQuery(".rounded").corners(), then I don't see any visual change in the div's corners.

      Could anybody give me an example of using the jQuery() function in Javascript please?

      • 1128 Views
      • Tags:
        • 1. Re: How to use the jQuery funtion?
          nbelaevski
          nbelaevski Feb 16, 2009 1:52 PM (in response to dxxvi)

          Hello,

          I guess the problem happens because jQuery script itself isn't loaded on the page. Add

          <a4j:loadScript src="resource:///org/richfaces/renderkit/html/scripts/jquery/jquery.js" />


            • Actions
          • 2. Re: How to use the jQuery funtion?
            ronanker
            ronanker Apr 29, 2009 8:16 AM (in response to dxxvi)

            just a remark, because i had a bug with this...

            if you use the load strategy ALL, then jQuery is automatically included and the line

            <a4j:loadScript src="resource:///org/richfaces/renderkit/html/scripts/jquery/jquery.js" />

            will cause a problem (i think some king of internal plugins to jQuery are lost...)

            I use jQuery in my scripts and when i'm in dev mode i change the load strategy to be able to see readable javascript when debugging.

            so to force the inclusion of jQuery i prefer using : 
            <!-- <rich:jQuery selector="document" query="ready(function(){ })"/> -->
            in the head. this way, no more problems.

              • Actions