Richfaces is not defined javascript error

Question

When I try to call Richfaces.showModalPanel('id') I am getting Richfaces is not defined javascript error and nothing happening.

In my sample application I have two pages, one is master view and another page is child view. Child view invokes popupPanel in master view using above call. I am not sure what is wrong. Any pointers would be appreciated.

Here are the pages I have:

First page:

<!DOCTYPE html>
<html lang="en"
      xmlns="http://www.w3.org/1999/xhtml"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:rich="http://richfaces.org/rich"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:richext="http://java.sun.com/jsf/composite/richext">
    <h:head>
        <title>Page Title</title>

    </h:head>
    <h:body>

     <ui:include id="nextPageInclude" src="secondpage.xhtml"/>   
    <rich:popupPanel id="logoutDialogId"
                 width="300"
                 height="50"
                 autosized="true"
                 resizeable="false"
                 moveable="true"
                 modal="true"
                 style="border:5px solid #5e81ac; background-color:#dce3ed;">

        <h:outputText value="Inside logout window"/>
    </rich:popupPanel>

    </h:body>
</html>

Second page:

<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="http://richfaces.org/a4j"
    xmlns:rich="http://richfaces.org/rich">
    <h:head/>
    <a4j:outputPanel id='headerLinks' layout="block">
        <ul id="sddm">
            <li>
            </li>
            <li>
            </li>
            <li>
                <a4j:commandLink id="logoutLinkId"
                                 value="Logout"
                                 onclick="Richfaces.showPopupPanel('logoutDialogId')"
                                 styleClass="linkLogout"/></li>

        </ul>
        <div style="clear:both"></div>
    </a4j:outputPanel>
</ui:composition>

EDIT: Attached loaded JS screenshot

enter image description here

Thank you,

saNiks · Accepted Answer · 2012-05-02 18:57:06Z

8

The issue with the above code is that since RichFaces 4.0 we can't make the old calls to open a popupPanel, the way you have written it is obsolete, try this if you may instead:-

<a4j:commandLink id="logoutLinkId"
    value="Logout"
    onclick="#{rich:component('logoutDialogId')}.show();"
    styleClass="linkLogout"/>

And similarly to hide the popupPanel use

<a4j:commandLink id="Close_Modal"
    value="Close Logout"
    onclick="#{rich:component('logoutDialogId')}.hide();"
    styleClass="linkLogout"/>

answered May 2, 2012 at 18:57

saNiks

7646 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

saNiks Over a year ago

Your welcome :) My 1st contribution to the world on stackOverflow

kosa Over a year ago

Welcome to SO. Keep contributing your knowledge. Gave +1. By the way you may see lot Richfaces4 related questions from me (We are in process of upgrading from 3.x to 4.2)

saNiks Over a year ago

I am all ears if I can find the problem I will share the answer :)

BalusC · Accepted Answer · 2012-05-01 20:47:21Z

2

Remove the <h:head> from the include composition. It doesn't belong there and would possibly corrupt the generated HTML head. The <h:head> should be declared only once throughout the view and preferably only in the master template.

Another possible cause is that you've a Filter which happens to match the URL pattern of resource requests as well which in turn is not doing its job entirely right. Check HTML source which <script> elements are all generated and press F12 in Firebug/Chrome/IE9 and explore the Net (or Network) tab to see what browser has all retrieved as to JS resources.

Update: the object name is RichFaces with the uppercase F, not Richfaces. Fix it as well.

edited May 1, 2012 at 20:47

answered May 1, 2012 at 20:30

BalusC

1.1m377 gold badges3.7k silver badges3.6k bronze badges

8 Comments

kosa Over a year ago

Hi BalusC, Initially I did try without head in composition, it didn't work. Then I added h:head there, still same issue. I think something else going on.

kosa Over a year ago

Hi BalusC, Attached screenshot of loaded JS. It does contain jsf.js.xhtml.

BalusC Over a year ago

The richfaces.js contains that function. Please check what the browser has actually retrieved. Your problem indicates that it returned a 404 or something entirely different. Or just follow that script URL yourself by copying it in address bar.

kosa Over a year ago

Having richfaces.js.xhtml in script is correct? It should be just richfaces.js right?

BalusC Over a year ago

Yes, it's correct. JSF resources are handled by FacesServlet. By the way, shouldn't the function name be RichFaces instead of Richfaces?

|

Collectives™ on Stack Overflow

Richfaces is not defined javascript error

2 Answers 2

3 Comments

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related