Problem loading richfaces javascript on dynamic facelet include (Richfaces 4.2.2 )
mojojojo Aug 2, 2012 11:28 PMHi,
I am currently working on a project where all UI actions should be AJAX including our navigation. We have a navigation menu and the content of the page will be rerender based on the selection of the user.
We have home.xhtml which will contain the facelet depending on the value of the contentArea.
home.xhtml
<ui:define name="body"> <ui:include src="#{bean.contentArea}" ></ui:include> </ui:define>
The default value of contentArea is /xhtml/contentarea/blank.xhtml
blank.xhtml
<!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:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:a4j="http://richfaces.org/a4j" xmlns:rich="http://richfaces.org/rich"> This is blank </html>
But when I click on request on my nav header thus contentarea's value is changed to /xhtml/contentarea/request.xhtml, the components and data are loaded but there are javascript error
/xhtml/contentarea/request.xhtml
<!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:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:a4j="http://richfaces.org/a4j" xmlns:util="http://java.sun.com/jsf/composite/util" xmlns:rich="http://richfaces.org/rich"> <ui:composition> ... <rich:jQuery selector="#mainTable" timing="domready" query="colResizable()" /> ... </ui:composition> </html>
JAVASCRIPT ERROR
TypeError: RichFaces.jQuery is undefined
But when I refresh the page (bean is in session scope), no javascript error.
Please note that in actual there are several javascript error thrown for my richfaces components.
Actual errors:
TypeError: RichFaces.jQuery is undefined
TypeError: RichFaces.ui.TabPanel is not a constructor
TypeError: RichFaces.ui.Tab is not a constructor
TypeError: RichFaces.ui.Tab is not a constructor
TypeError: RichFaces.ui.Tab is not a constructor
TypeError: RichFaces.ui.Tab is not a constructor
TypeError: RichFaces.jQuery is undefined
TypeError: RichFaces.ui.CollapsibleSubTableToggler is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTable is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTableToggler is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTable is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTableToggler is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTable is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTableToggler is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTable is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTableToggler is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTable is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTableToggler is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTable is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTableToggler is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTable is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTableToggler is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTable is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTableToggler is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTable is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTableToggler is not a constructor
TypeError: RichFaces.ui.CollapsibleSubTable is not a constructor
TypeError: RichFaces.ui.DataTable is not a constructor
TypeError: RichFaces.jQuery is undefined
TypeError: RichFaces.jQuery is undefined
TypeError: RichFaces.jQuery is undefined
TypeError: RichFaces.jQuery is undefined
TypeError: RichFaces.ui.Tooltip is not a constructor
Anybody who has encountered this same problem? Please advise on what am I missing here. Thanks!