File APIs for Java Developers
Manipulate DOC, XLS, PPT, PDF and many others from your application.
http://aspose.com/file-tools
The moose likes JSF and the fly likes JSF - Missing source code using templating and composition Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login


Win a copy of EJB 3 in Action this week in the EJB and other Java EE Technologies forum!
JavaRanch » Java Forums » Java » JSF
Bookmark "JSF - Missing source code using templating and composition" Watch "JSF - Missing source code using templating and composition" New topic
Author

JSF - Missing source code using templating and composition

Kim Ming Yap
Ranch Hand

Joined: Dec 17, 2008
Posts: 53

First let me apologize for posting it here (after i have posted in stackoverflow and not getting much response).

This is really strange or maybe i just don't understand JSF.

To make the whole story short, supposedly i have the following:

a. File masterLayout.xhtml - main template
b. File myPractice.xhtml - compositions which uses file masterLayout.xhtml templating

------------------------------------------------------------------------------------------------------------------------------------------------

masterLayout.xhtml page will go to myPractice.xhtml (using ajax). The myPractice.xhtml rendered correctly - displaying all components from the template and from its own page. But when i click the 'view page source code', i only see the source code of masterLayout.xhtml.

Here's the source code:

IMPORTANT NOTE: masterLayout.xhtml HAS A RICHFACES COMMANDBUTTON (a4j:commandButton) WHICH RENDER THE PANEL ID "myPractice" FOUND IN myPractice.xhtml. This commandButton render the page through ajax means. It also means ajax is called from masterLayout page to render the panel id on another page myPractice page. Not sure if this is the cause of the issue

------------------------------------------------------------------------------------------------------------------------------------------------

masterLayout.xhtml (template)

<!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:rich="http://richfaces.org/rich"
xmlns:a4j="http://richfaces.org/a4j">

<h:head>
<title>MView Analytics Reporting</title>
<h:outputStylesheet library="css" name="styles.css" />
<h:outputScript library="javascript" name="realTimeClock.js"/>
</h:head>

<h:body onload="updateClock(); setInterval('updateClock()', 1000 );">

<h:form>
<a4j:poll id="poll" interval="5000" enabled="true" actionListener="#{marketSumm.marketSummAction}" render="marketSummary"/>
</h:form>

<h:form>

<rich:panel>

<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td style="width:8%;"> </td>
<td style="width:84%;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr style="height:66px">
<td style="width:90px"><img src="resources/images/lg_cgi_header.gif" height="50px"/></td>
<td style="width:24%; padding-top:18px; font-size:20px;">Advisor Portal</td>
<td style="width:66%">
<table width="100%" align="right" border="0" cellpadding="0" cellspacing="0" >
<tr><td colspan="5" style="height:35px; font-size:15px; text-align:right;">Welcome: <b>Jack Black</b></td></tr>
<tr>
<td width="60%"> </td>
<td width="15%" align="right"><h:commandLink style="color:black;" value="My Profile"/></td>
<td width="15%" align="center"><h:commandLink style="color:black;" value="Add New Client"/></td>
<td width="5%" align="center"><h:commandLink style="color:black;" value="Help"/></td>
<td width="5%" align="right"><h:commandButton style="color:black;" value="Logout"/></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td style="width:8%;"> </td>
</tr>

<tr style="background-color:gray; height:30px;">
<td style="width:8%;"> </td>
<td>
<h:panelGrid style="width:100%; background-color:gray;" cellpadding="0" cellspacing="0">
<f:facet name="header">
<h:panelGrid style="width:100%;"
cellpadding="0" cellspacing="0" columns="7"
columnClasses="practiceTabColumn,
planningTabColumn,
tradingTabColumn,
reportsTabColumn,
searchColumn,
clientTabColumn,
goBox">
<a4j:commandButton styleClass="#{control.myPracticeStyle}" value="MY PRACTICE" action="myPractice" actionListener="#{control.myPracticeAction}" render="myPractice"/>
<a4j:commandButton styleClass="#{control.planningStyle}" value="PLANNING" action="planning" actionListener="#{control.planningAction}" render="planning"/>
<a4j:commandButton styleClass="#{control.tradingStyle}" value="TRADING" action="trading" actionListener="#{control.tradingAction}" render="trading"/>
<a4j:commandButton styleClass="#{control.reportsStyle}" value="REPORTS" action="reports" actionListener="#{control.reportsAction}" render="reports"/>
<h:inputText style="width:52%" value="Search" size="22"/>
<h:selectOneMenu>
<f:selectItem itemValue="1" itemLabel="Client"/>
<f:selectItem itemValue="2" itemLabel="James Bunday"/>
<f:selectItem itemValue="3" itemLabel="Andy R. Murray"/>
<f:selectItem itemValue="4" itemLabel="John Bastilano"/>
<f:selectItem itemValue="5" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="6" itemLabel="Tony Clement"/>
<f:selectItem itemValue="7" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="8" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="9" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="10" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="11" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="12" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="13" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="14" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="15" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="16" itemLabel="Emma W. Sterling Morrison"/>
<f:selectItem itemValue="17" itemLabel="Client"/>
<f:selectItem itemValue="18" itemLabel="James Bunday"/>
<f:selectItem itemValue="19" itemLabel="Andy R. Murray"/>
<f:selectItem itemValue="20" itemLabel="John Bastilano"/>
<f:selectItem itemValue="21" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="22" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="23" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="24" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="25" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="2" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="27" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="28" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="29" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="30" itemLabel="Emma W. Sterling"/>
<f:selectItem itemValue="31" itemLabel="Emma W. Sterling"/>
</h:selectOneMenu>
<h:commandButton style="color:black;" value="GO"/>
</h:panelGrid>
</f:facet>
</h:panelGrid>
</td>
<td style="width:8%;"> </td>
</tr>
<tr style="height:780px;">
<td style="width:8%;"> </td>
<td style="width:8%;">
<br/>
<ui:insert name="content">
</ui:insert>
</td>
<td style="width:8%;"> </td>
</tr>
</table>

</rich:panel>

</h:form>

</h:body>


You can see the ui:insert here.


------------------------------------------------------------------------------------------------------------------------------------------------

myPractice.xhtml

<?xml version="1.0" encoding="UTF-8"?>
<!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:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:rich="http://richfaces.org/rich"
xmlns:a4j="http://richfaces.org/a4j">
<ui:composition template="/templates/masterLayout.xhtml">

<ui:define name="content">

<rich:panel id="myPractice" style="height:764px; border:0px; padding:0px;">

<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td style="width:100%;">
<h:panelGrid style="width:100%;" cellpadding="0" cellspacing="0">
<f:facet name="header">
<h:panelGrid style="width:100%;" cellpadding="0" cellspacing="0" columns="5"
columnClasses="overviewTabColumn,
aumTabColumn,
feesTabColumn,
cashFlowTabColumn,
emptyTabColumn">
<a4j:commandButton styleClass="#{control.overviewStyle}" value="OVERVIEW" action="overview" actionListener="#{control.overviewAction}" render="overview"/>
<a4j:commandButton styleClass="#{control.aumStyle}" value="AUM" action="aum" actionListener="#{control.aumAction}" render="aum"/>
<a4j:commandButton styleClass="#{control.feesStyle}" value="FEES" action="fees" actionListener="#{control.feesAction}" render="fees"/>
<a4j:commandButton styleClass="#{control.cashFlowStyle}" value="CASH FLOW" action="cashFlow" actionListener="#{control.cashFlowAction}" render="cashFlow"/>
<h:outputText value="" style="width:100%;"/>
</h:panelGrid>
</f:facet>
</h:panelGrid>
</td>
</tr>
<tr><td> </td></tr>
<tr>
<td>
<ui:insert name="subContent">
</ui:insert>
</td>
</tr>
</table>

</rich:panel>

</ui:define>

</ui:composition>

</html>


This whole define supposed to go into masterLayout.xhtml ui:insert section.

------------------------------------------------------------------------------------------------------------------------------------------------

Actual 'View Page source' from FireFox or IE when myPractice.xhtml is rendered and displayed.


</td>
<td style="width:8%;"> </td>
</tr>
<tr style="height:780px;">
<td style="width:8%;"> </td>

<td style="width:8%;">
<br />
</td>
<td style="width:8%;"> </td>
</tr>
</table></div></div><input type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState" value="-8616720734293216541:-1864513498741194775" autocomplete="off" />

If you look at this 'View Page source code' carefully comparing to masterLayout.xhtml, starting from height:780px, you will notice that the section ui:insert name="content" .. is empty.

Tim Holloway
Saloon Keeper

Joined: Jun 25, 2001
Posts: 15641
    
  15

"View Source" very frequently doesn't actually display the source of the current page. Instead it may make a whole new page request and display what came back. Which can be a problem in the best of cases, but especially in JSF, where the URL isn't tied as tightly to the source resource names.

On a separate note, you can make code and XML easier for us to read if you wrap it in code tags. There's a "Code" button in the Ranch message editor that can do that.

I have a bad habit myself also of skipping really long examples because it's too hard to read them on-screen, so you can boost your chances of getting help by snipping out obviously repetitive/redundant stuff.


Customer surveys are for companies who didn't pay proper attention to begin with.
 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: JSF - Missing source code using templating and composition
 
Similar Threads
Can not Populate the form on combo box change
Multipart request problem
javax.xml.rpc.soap.SOAPFaultException: System.Web.Services.Protocols.SoapException:
Client side validation not working
How to control the length of <selectonemenu while while data is coming from database