My name is Tomasz and this is my first question here. Here is my problem.
I am a junior Java EE developer and I have 4 moths experience with Java EE, Spring, Spring-Webflow, JSF 2 and Primefaces. I want to learn more by doing my own web application.
I have no experience with starting a new project with technologies I mentioned, so basically I copied a template application and changed it a little bit (mostly removed unnecessary features which I won't need now). So my application contains:
- Spring 3.2.2
- Spring Webflow 2.3.2
- JSF 2.1.22
- Primefaces 3.5
- and Hibernate JPA (it doesn't matter, this part works good).
As a server I use Tomcat 7.0.40.
I configured my application using many configuration tutorials. Application works, it doesn't have warnings but it does not work as it should. Let me show you screen shots:
Firt one, when I start the application, it looks like this:
http://oi44.tinypic.com/2wd4od3.jpg
But after I refresh the browser by pressing F5, it looks like it should from the beginning:
http://oi39.tinypic.com/17fr06.jpg
It is a really strange behaviour for me, I don't know why it happens. Browser doesn't matter. I've tried it on Chrome, FireFox and IE - the same effect.
Also p:commandLink seems to ignore me. I click it and nothing happens. When I have option
ajax="false"
enabled it looks like the page is refreshed, but still nothing happens. I work a lot with primefaces and swf at work, and that never happend to me.
Here are some details from my application, I can post everything on request:
template (main.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:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<ui:include src="/WEB-INF/layout/fragments/layout.xhtml" />
</html>
layout (layout.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:c="http://java.sun.com/jsp/jstl/core"
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:p="http://primefaces.org/ui">
<f:view contentType="text/html" encoding="UTF-8">
<h:head>
</h:head>
<h:body>
<!-- outputStyle have to be here, otherwise css order is wrong -->
<h:outputStylesheet id="cssStandard" library="css" name="standard.css" />
<!-- <h:outputStylesheet id="cssStandard" library="css" name="simple.css" /> -->
<h:form>
<div id="glass"
style="position: absolute; width: 100%; height: 100%; z-index: 2000; display: none;"></div>
<ui:include src="/WEB-INF/layout/fragments/ajaxError.xhtml" />
<p:layout id="layout" fullPage="false"
style="width: 1000px; height: 900px; margin: 0 auto;">
<p:layoutUnit position="north" size="150">
<ui:include src="/WEB-INF/layout/fragments/north.xhtml" />
</p:layoutUnit>
<p:layoutUnit position="center">
<h:form>
<ui:insert name="content" />
</h:form>
</p:layoutUnit>
</p:layout>
<p:outputPanel id="dialogs" style="display:block; overflow: auto;">
<ui:insert name="dialogs" />
</p:outputPanel>
</h:form>
</h:body>
</f:view>
</html>
navigation menu (north.xhtml):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:c="http://java.sun.com/jsp/jstl/core"
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:p="http://primefaces.org/ui">
<h:form>
<a href="#{facesContext.externalContext.requestContextPath}"> <p:graphicImage
name="logo.png" library="images/application" />
</a>
<h:panelGrid columns="3" style="width: 100%">
<h:column>
<p:menubar style="width: 300px">
<p:menuitem value="Strona Główna" action="forwardTo" ajax="false">
<f:setPropertyActionListener target="#{flowController.flowId}"
value="main" />
</p:menuitem>
<p:submenu label="MENU_2">
</p:submenu>
</p:menubar>
</h:column>
<h:column>
<h:outputText value="Zalogowany jako: " style="float: right" />
</h:column>
<p:column>
<p:menuButton
value="#{mainController.loggedUser != null ? mainController.loggedUser.login : 'Gość'}">
<p:menuitem value="Zaloguj" action="forwardTo" ajax="false">
<f:setPropertyActionListener target="#{flowController.flowId}"
value="login" />
</p:menuitem>
<p:menuitem value="Wyloguj" />
</p:menuButton>
</p:column>
</h:panelGrid>
</h:form>
</ui:composition>
base-flow.xml:
<?xml version="1.0" encoding="UTF-8"?>
<flow xmlns="http://www.springframework.org/schema/webflow"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="
http://www.springframework.org/schema/webflow
http://www.springframework.org/schema/webflow/spring-webflow-2.0.xsd"
abstract="true">
<end-state id="endAndForwardTo" view="flowRedirect:#{flowController.flowId}" />
<global-transitions>
<transition on="forwardTo" to="endAndForwardTo" validate="false" />
<transition on="endAndForwardTo" to="endAndForwardTo" />
</global-transitions>
</flow>
FlowController.java:
package tomashoov.polskielowiska.flow;
import org.apache.log4j.Logger;
import org.springframework.context.annotation.Scope;
import org.springframework.stereotype.Component;
#Component
#Scope("session")
public class FlowController {
private Logger LOG = Logger.getLogger(FlowController.class);
public final static String MAIN = "main";
public final static String LOGIN = "login";
private String flowId = MAIN;
public String getFlowId() {
return flowId;
}
public void setFlowId(String flowId) {
this.flowId = flowId;
}
}
If more details are needed, please tell me.
I faced the exact same problem and I dug a little in this problem and I made a work around to fix this bug (since I am very late in my project). I will come back with a robust solution later, but here is what I got:
You are using Spring Webflow the start page is index.jsp with <meta http-equiv="Refresh" content="0; URL=MAIN_WEB_FLOW_URL" /> to force redirect to the main web flow.
You will find in your browser console 2 JavaScript errors:
ReferenceError: $ is not defined
ReferenceError: PrimeFaces is not defined
These errors are because missing JavaScript files:
JQuery JavaScript.
Primefaces JavaScript.
Layout JavaScript.
Note that there is also CSSs files missing and that is why the page layout sizes and locations are missed up.
So, it is obvious the the <h:head></h:head> tags didn't fetch some Primefaces JavaScript files and CSSs on the redirect. I found an issue here with the redirect resources fetch failure. The proposed solution was to add <h:outputScript library="primefaces" name="jquery/jquery.js" target="head" /> in the <h:head></h:head>. So, I added the missing scripts and the CSS files in the <h:head></h:head> and it worked like a charm.
<h:outputStylesheet library="primefaces" name="primefaces.css" />
<h:outputStylesheet library="primefaces" name="layout/layout.css" />
<h:outputScript library="primefaces" name="jquery/jquery.js" target="head" />
<h:outputScript library="primefaces" name="jquery/jquery-plugins.js" target="head" />
<h:outputScript library="primefaces" name="primefaces.js" target="head" />
<h:outputScript library="primefaces" name="layout/layout.js" target="head" />
Related
Below is my code for my file upload page and I can't figure out why when the upload is done it doesn't update my datatable with if the upload was successful or not. I could do a like a do not render til after update but don't think that is supported with the fileupload command. I did a system out on my list and it does have the values in it so the list is fully populated and ready to display but my datatable isn't showing anything? Am I missing something?
Tomcat 7.0
JSF 2.2.1
Chrome/IE/Firefox
PrimeFaces 5.0
<?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:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<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:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core"
template="templates/template.xhtml">
<ui:define name="title">Ingest</ui:define>
<ui:define name="metadata">
</ui:define>
<ui:define name="content">
<h:form>
<p:fileUpload fileUploadListener="#{ingestBean.ingestListener}"
label="choose" invalidFileMessage="Invalid file: "
allowTypes="/(\.|\/)(xml)$/" multiple="true" update="#form">
</p:fileUpload>
<p:dataTable var="errors" value="#{ingestBean.errorList}" id="errorTable">
<p:column headerText="File Name">
<h:outputText value="#{errors.fileName}" />
</p:column>
<p:column headerText="Status">
<h:form>
<h:commandLink action="#{ingestBean.getErrorInfo}"
value="errors.status">
<f:param name="id" value="#{errors.id}" />
</h:commandLink>
</h:form>
</p:column>
</p:dataTable>
</h:form>
</ui:define>
</ui:composition>
</html>
Edit: After a bunch of testing and code rewriting I have got it partially working but it seems like it doesn't like to render in my template code... So I was wondering if there may be something wrong in my template code.
Template code:
<!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:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core">
<f:view contentType="text/html" id="fview">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><ui:insert name="title">Page template with PrimeFaces</ui:insert></title>
<ui:debug />
<f:metadata>
<ui:insert name="metadata" />
</f:metadata>
<h:head>
<style>
#leftPanel {
z-index: 1 !important;
}
#leftPanel div {
overflow: visible;
}
</style>
</h:head>
<h:body onload="statusDialog.hide();">
<h:outputStylesheet library="css" name="style.css" />
<p:ajaxStatus onstart="statusDialog.show();"
onsuccess="statusDialog.hide();" />
<p:layout fullPage="true" resizeTitle="resize"
style="background-color:#FFFFFF;">
<p:layoutUnit position="north" size="68" id="north">
<ui:include src="header.xhtml" />
</p:layoutUnit>
<p:layoutUnit position="west" size="202" header="Menu" id="leftPanel">
<ui:include src="menu.xhtml" />
</p:layoutUnit>
<p:layoutUnit styleClass="layoutUnitCenter" position="center">
<h:form id="mainForm">
<ui:insert name="content" />
</h:form>
</p:layoutUnit>
</p:layout>
</h:body>
</f:view>
</html>
After a bunch of testing and deleting and rewriting like all my code I have figured out it was a stupid error with layouts and the <f:view> so I removed that and
<p:ajaxStatus onstart="statusDialog.show();"
onsuccess="statusDialog.hide();" />
And everything seemed to work fine!
I am trying to create an application using JSF and Primefaces. Unfortunately, I have an issue about page templates and could not manage to work it out properly.
I have a page template like this. What I want is to load Left Menu and the Content with ajax request without loading whole page. However, when I click the page2 link, everything gets broken like this.
I tried different combinations of how to place form, include, composition tags but, it's still the same. Only change is my server response according to place of form tag. When I checked the response it seems alright. It does not try to load whole page and nothing seems wrong to me:
<?xml version='1.0' encoding='UTF-8'?>
<partial-response id="j_id1"><changes><update id="javax.faces.ViewRoot"><![CDATA[<script id="innerLayout_s" type="text/javascript">$(function(){PrimeFaces.cw( "Layout","widget_innerLayout",{id:"innerLayout",widgetVar:"widget_innerLayout",west:{paneSelector:'#left',size:"200",resizable:false,closable:false},center:{paneSelector:'#innerContent',size:"auto",resizable:false,closable:false}},"layout");}) ;</script><div id="innerLayout"><div id="left" class="ui-layout-unit ui-widget ui-widget-content ui-corner-all ui-layout-west"><div class="ui-layout-unit-header ui-widget-header ui-corner-all"><span class="ui-layout-unit-header-title">Left Menu</span></div><div class="ui-layout-unit-content ui-widget-content">
<form id="leftForm" name="leftForm" method="post" action="/Magician/pages/page2.xhtml" enctype="application/x-www-form-urlencoded">
<input type="hidden" name="leftForm" value="leftForm" />
Page2 Left Menu
</form></div></div><div id="innerContent" class="ui-layout-unit ui-widget ui-widget-content ui-corner-all ui-layout-center"><div class="ui-layout-unit-content ui-widget-content">
<form id="contentForm" name="contentForm" method="post" action="/Magician/pages/page2.xhtml" enctype="application/x-www-form-urlencoded">
<input type="hidden" name="contentForm" value="contentForm" />
Page2 Content
</form></div></div></div>]]></update><update id="j_id1:javax.faces.ViewState:0"><![CDATA[2499963408064928377:-8018685353649439725]]></update></changes></partial-response>
However, when I look the console, there is an error like below:
Uncaught TypeError: Cannot read property '0' of null primefaces.js.xhtml?ln=primefaces&v=5.0:2
PrimeFaces.ajax.Utils.updateElement primefaces.js.xhtml?ln=primefaces&v=5.0:2
PrimeFaces.ajax.ResponseProcessor.doUpdate primefaces.js.xhtml?ln=primefaces&v=5.0:2
PrimeFaces.ajax.Response.handle primefaces.js.xhtml?ln=primefaces&v=5.0:2
p.success primefaces.js.xhtml?ln=primefaces&v=5.0:2
i jquery.js.xhtml?ln=primefaces&v=5.0:25
cd.fireWith jquery.js.xhtml?ln=primefaces&v=5.0:25
cg jquery.js.xhtml?ln=primefaces&v=5.0:25
i
Here are my codes:
default.xhtml:
<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:p="http://primefaces.org/ui">
<h:head>
<title>My Application</title>
</h:head>
<h:body>
<h:outputStylesheet name="css/style.css" />
<p:layout id="fullPageLayout" fullPage="true">
<p:layoutUnit id="header" position="north" size="80">
<h:form id="headerForm">
<ui:insert name="headerUI">
<ui:include src="header.xhtml" />
</ui:insert>
</h:form>
</p:layoutUnit>
<p:layoutUnit id="content" position="center">
<ui:insert name="contentUI" />
</p:layoutUnit>
</p:layout>
</h:body>
</html>
header.xhtml:
<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:p="http://primefaces.org/ui">
<p:tabMenu id="tabMenu" activeIndex="#{templateBean.activeIndex}">
<p:menuitem value="page1" action="#{templateBean.navigateToPage(0)}" update=":contentForm,tabMenu" />
<p:menuitem value="page2" action="#{templateBean.navigateToPage(1)}" update=":contentForm,tabMenu" />
</p:tabMenu>
</ui:composition>
content.xhtml:
<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:p="http://primefaces.org/ui">
<p:layout id="innerLayout">
<p:layoutUnit id="left" position="west" size="200" header="Left Menu">
<h:form id="leftForm">
<ui:insert name="leftUI" />
</h:form>
</p:layoutUnit>
<p:layoutUnit id="innerContent" position="center">
<h:form id="contentForm">
<ui:insert name="centerUI" />
</h:form>
</p:layoutUnit>
</p:layout>
</ui:composition>
index.xhtml:
<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:p="http://primefaces.org/ui"
template="templates/default.xhtml">
<ui:define name="contentUI">
<ui:include src="#{templateBean.activePage}.xhtml" />
</ui:define>
</ui:composition>
page1.xhtml:
<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:p="http://primefaces.org/ui"
template="templates/content.xhtml">
<ui:define name="leftUI">
<h:outputText value="Page1 Left Menu" />
</ui:define>
<ui:define name="centerUI">
<h:outputText value="Page1 Content" />
</ui:define>
</ui:composition>
page2.xhtml:
<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:p="http://primefaces.org/ui"
template="templates/content.xhtml">
<ui:define name="leftUI">
<h:outputText value="Page2 Left Menu" />
</ui:define>
<ui:define name="centerUI">
<h:outputText value="Page2 Content" />
</ui:define>
</ui:composition>
TemplateBean.java:
package com.myapplication.pagebeans;
import org.springframework.context.annotation.Scope;
import org.springframework.stereotype.Component;
#Component
#Scope("request")
public class TemplateBean {
private int activeIndex;
private String activePage = "page1";
public String navigateToPage(int index) {
activeIndex = index;
switch (index) {
case 0:
activePage = "page1";
break;
case 1:
activePage = "page2";
break;
default:
break;
}
return activePage;
}
public int getActiveIndex() {
return activeIndex;
}
public String getActivePage() {
return activePage;
}
}
Sorry for the long question and images (site does not let me to load images because of my reputation) but, I tried give information as much as I can.
Thanks in advance.
I searched a lot and already look at different questions like below ones:
How to include common content into multiple level template page
How to include another XHTML in XHTML using JSF 2.0 Facelets?
Facelets multi-level templates - ui:define not rendered
PrimeFaces exension javascript error
I am new here :)
I have got a problem with one of my first web-apps written using JSF.
I wrote a simple template, it looks like this:
<?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:h="http://java.sun.com/jsf/html" xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
<p:layout fullPage="true">
<p:layoutUnit position="north" header="North - header" style="font-size: 15px;">
<h:form>
<ui:include src="header.xhtml"/>
</h:form>
</p:layoutUnit>
<p:layoutUnit position="west" header="West - menu" style="font-size: 15px;">
<h:form>
<ui:include src="menu.xhtml"/>
</h:form>
</p:layoutUnit>
<p:layoutUnit position="center" header="Center - content" style="font-size: 15px;">
<h:form id="contentForm">
<ui:insert name="content"/>
</h:form>
</p:layoutUnit>
<p:layoutUnit position="east" header="East - nothing" style="font-size: 15px;">
</p:layoutUnit>
<p:layoutUnit position="south" header="South - footer" style="font-size: 15px;">
<ui:include src="footer.xhtml"/>
</p:layoutUnit>
</p:layout>
</h:head>
<h:body>
</h:body>
</html>
And in another file (obrazek.xhtml) I wrote this code:
<?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:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core">
<h:head>
<title>Simple JSF Facelets page</title>
</h:head>
<h:body>
<ui:composition template="template.xhtml">
<ui:define name="content">
<h:form id="PHOTOS">
<p:panelGrid columns="2">
<h:commandLink action="#{pic.addValue1}">
<p:graphicImage url="resources/images/1.png">
<p:ajax update="wynik1" event="click"/>
</p:graphicImage>
</h:commandLink>
<h:commandLink action="#{pic.addValue2}">
<p:graphicImage url="resources/images/2.png">
<p:ajax update="wynik1" event="click"/>
</p:graphicImage>
</h:commandLink>
<h:outputText value="Obrazek 1: #{pic.val1}" id="wynik1"/>
<h:outputText value="Obrazek 2: #{pic.val2}" id="wynik2"/>
</p:panelGrid>
</h:form>
</ui:define>
</ui:composition>
</h:body>
</html>
I wanted to insert some code into "content" primefaces layoutUnit.
IDEA: It has to be 2 pictures and if I click on one of them, AJAX should show the value from ManagedBean using h:outputText. (it always adds +1 to the value :))
The problem is: if I dont add templating** into obrazek.xhtml everything works fine, but if I add:
<ui:composition template="template.xhtml">
<ui:define name="content">
CODE FROM FORM "PHOTOS" (the one about I called upper that "is no templated"**)
</ui:define>
</ui:composition>
while I am clicking on some picture nothing happens. Just "#" is added to my URL and it looks like that:
http://localhost:8080/obrazek.xhtml#
And my ManagedBean also:
#ManagedBean(name = "pic", eager = true)
#SessionScoped
public class PictureBean {
private int val1;
private int val2;
public void addValue1(){
val1 += 1;
}
public void addValue2(){
val2 += 1;
}
GETTERS AND SETTERS FOR VAL1 VAL2
}
I have rummaged all the web looking for the answer but uselessly.
Could anyone here help me? :)
Pardon for so long post and not coloured syntax, have to figure out "how to" do it, first :D
I have spring integrated with JSF and I am facing a strange behavior:
I hit the command button the action method in the managed bean is hit successfully (I removed it in the below example).
The Ajax update works perfect and the form is updated.
I hit another button the action method now in the managed bean isn't hit.
The panel is restored to the initial view and it freezes on this view.
I can't get the form updated except if I refresh the page and these steps are repeated.
DealerInfo.xhtml:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<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:p="http://primefaces.org/ui">
<ui:composition template="/WEB-INF/templates/default.xhtml">
<ui:define name="content">
<h:form id="toolBarForm">
<p:toolbar style="margin-bottom:5px;">
<p:toolbarGroup align="right">
<p:commandButton value="Add"
update=":toolBarForm" icon="ui-icon-plusthick" />
</p:toolbarGroup>
</p:toolbar>
<p:messages id="dealerInfoMessages" />
<ui:include src="/pages/dealers/DealerMainInfo.xhtml" />
</h:form>
</ui:define>
</ui:composition>
</html>
pages/dealers/DealerMainInfo.xhtml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<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:p="http://primefaces.org/ui">
<ui:composition>
<p:panel id="dealerMainInfoPanel" header="Dealer Main Info"
style="margin-bottom:5px;">
<h:panelGrid columns="2">
<p:outputLabel for="dealerCode" value="Dealer Code" />
<p:inputText id="dealerCode" required="true"
value="#{dealerMainInfoBO.dealerCode}" style="width:200px;" />
<p:outputLabel for="dealerName" value="Dealer Name" />
<p:inputText id="dealerName" required="true"
value="#{dealerMainInfoBO.dealerName}" style="width:200px;" />
</h:panelGrid>
</p:panel>
</ui:composition>
</html>
Update:
I created a very simple single page and I noticed that when I remove the <h:head></h:head> tags the ajax works like a charm BUT without the fancy primefaces UI, and when I add the tags the ajax stop (this is normal cause <h:head></h:head> tags fetch all the needed JSs and CSSs), What Can I Do?
Example.xhtml
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html>
<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:p="http://primefaces.org/ui">
<f:view contentType="text/html">
<h:head>
</h:head>
<h:body>
<h:form id="toolBarForm">
<p:toolbar style="margin-bottom:5px;">
<p:toolbarGroup align="right">
<p:commandButton value="Add" update=":toolBarForm"
action="#{bean.add}" />
</p:toolbarGroup>
</p:toolbar>
<p:messages id="operationDefinitionMessages" />
<h:panelGrid columns="2">
<p:outputLabel for="text" value="Text" />
<p:inputText id="text" required="true" value="#{bean.text}" />
</h:panelGrid>
</h:form>
</h:body>
</f:view>
</html>
My Environment
Primefaces:3.5
JSF-Mojarra:2.2
Spring:3.2.3.RELEASE
In case anyone faces the same issue. I noticed that the Primefaces showcase is using JSF-Mojarra-2.1.22. I downgraded my JSF-Mojarra version from 2.2 to 2.1.22 and it worked like a charm.
If I am not wrong, I guess it should be reported to primefaces (if it isn't a current issue).
I can't get the preRenderView event listener to work on a GET request in JSF 2.1.
I have found a lot about it but nothing seems to work e.g.:
Conditional redirection in JSF
http://andyschwartz.wordpress.com/2009/07/31/whats-new-in-jsf-2/#get-prerenderview-event
http://developer.am/j2eetutorial/jsf/?page=jsf-2-prerenderviewevent-example
JSF, Spring, and the PreRenderViewEvent
http://balusc.blogspot.dk/2011/09/communication-in-jsf-20.html#ProcessingGETRequestParameters
I have a template with 4 insert blocks and I have tried to insert the event code at all those places but without any luck. I have tried both with and without the f:metadata tag surrounding it.
<f:event type="preRenderView" listener="#{applicationData.redirectIfNoResults}" />
Bean:
#ManagedBean
#ApplicationScoped
public class ApplicationData implements Serializable {
public void redirectIfNoResults() throws IOException {
if (getTotal() < 1) {
ExternalContext ec = FacesContext.getCurrentInstance().getExternalContext();
ec.redirect(ec.getRequestContextPath() + "/noResults.xhtml");
}
}
...
}
Template:
<?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:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">
<ui:insert name="beforeHeader" />
<f:view>
<ui:insert name="inView" />
</f:view>
<h:head>
<meta http-equiv="cache-control" content="no-store" />
<link href="style.css" rel="stylesheet" type="text/css" />
<title>Quick Poll</title>
<ui:insert name="header" />
</h:head>
<h:body>
<h1>Quick Poll</h1>
<ui:insert name="content" />
</h:body>
</html>
View:
<ui:define name="content">
#{applicationData.question}?<p/>
<h:panelGrid columns="3" border="0">
Yes:
<h:panelGrid bgcolor="black" height="20" width="#{300*applicationData.yes/applicationData.total}"/>
#{applicationData.yes}
<h:outputText value="No:"/>
<h:panelGrid bgcolor="black" height="20" width="#{300*applicationData.no/applicationData.total}"/>
#{applicationData.no}
</h:panelGrid>
</ui:define>
</ui:composition>
Please help me figure out how to get it working..
Update 1:
I have made changes as suggested by BalusC but it is still not working..
Template:
<?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:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">
<h:head>
<meta http-equiv="cache-control" content="no-store" />
<link href="style.css" rel="stylesheet" type="text/css" />
<title>Quick Poll</title>
<ui:insert name="header" />
</h:head>
<h:body>
<h1>Quick Poll</h1>
<ui:insert name="content" />
</h:body>
</html>
View:
<?xml version='1.0' encoding='UTF-8' ?>
<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:c="http://java.sun.com/jsp/jstl/core"
xmlns:f="http://java.sun.com/jsf/core"
template="template.xhtml">
<ui:define name="content">
<f:event listener="#{applicationData.redirectIfNoResults}" type="preRenderView"></f:event>
#{applicationData.question}?<p/>
<h:panelGrid columns="3" border="0">
Yes:
<h:panelGrid bgcolor="black" height="20" width="#{300*applicationData.yes/applicationData.total}"/>
#{applicationData.yes}
<h:outputText value="No:"/>
<h:panelGrid bgcolor="black" height="20" width="#{300*applicationData.no/applicationData.total}"/>
#{applicationData.no}
</h:panelGrid>
</ui:define>
</ui:composition>
That <f:view> isn't rightly used, it has to wrap the entire view. Remove it (JSF will implicitly create one), or at least let it wrap the entire view, including <h:head> and <h:body> tags.
By the way, the <f:event> does not need to go in a <f:metadata>. That applies only to <f:viewParam>. A <f:event> listener which depends on results of <f:viewParam> is indeed often for sole self-documentary purposes also placed in the same <f:metadata> block, but that is thus not a requirement of <f:event> itself.
In your case, it'd be easier to just put it in <ui:define name="content">.
ComponentSystemEvent seems to be missing in the method signature.
Method needs to look like this:
public void newRequest(final ComponentSystemEvent event) {
System.out.println("Someone requested me");
}
And then place a caller in the template or in the seperate views, that won't do any difference.
<f:event listener="#{userSessionAction.newRequest}" type="preRenderView"></f:event>
I ended up making a solution with a PostConstruct method in a view scope bean.
Like this: Initializng a Backing Bean With Parameters on Page Load with JSF 2.0
Bean:
#ManagedBean
#ViewScoped
public class ResultsController {
#ManagedProperty(value="#{applicationData.total}")
private int total;
#ManagedProperty(value="#{applicationData.yes}")
private int yes;
#ManagedProperty(value="#{applicationData.no}")
private int no;
#PostConstruct
public void postConstruct() {
if (getTotal() < 1) {
ExternalContext ec = FacesContext.getCurrentInstance().getExternalContext();
try {
ec.redirect(ec.getRequestContextPath() + "/noResults.jsf");
} catch (IOException e) {
System.out.println("noResults.jsf redirect failed.");
e.printStackTrace();
}
}
}
...
}
View:
<?xml version='1.0' encoding='UTF-8' ?>
<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:c="http://java.sun.com/jsp/jstl/core"
xmlns:f="http://java.sun.com/jsf/core"
template="template.xhtml">
<ui:define name="content">
#{applicationData.question}?<p/>
<h:panelGrid columns="3" border="0">
Yes:
<h:panelGrid bgcolor="black" height="20" width="#{300*resultsController.yes/resultsController.total}"/>
#{resultsController.yes}
<h:outputText value="No:"/>
<h:panelGrid bgcolor="black" height="20" width="#{300*resultsController.no/resultsController.total}"/>
#{resultsController.no}
</h:panelGrid>
</ui:define>
</ui:composition>