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
Thank you,
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"/>
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.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With