A-
My first example will begin
from scratch with Eclipse (it can also be done with NetBeans –actually more easily). I will build a JSF2 application and then
convert it to PrimeFaces JSF2 application.
I will use a small test program to check whether it works (thanks to Coreservlets).
B-
Secondly I will demonstrate
how to import and run PrimeFacesShowcase examples using the AJAX examples.
C-
Some other examples related
to DataTables etc. will follow consequently...
A-
Primefaces-basic-intro
application
Step 1
1.
New - > dynamicweb project
2.
Change Configuration
to Java Server Faces v2.0 Project
3.
Src - > next
4.
Web module - > next
5.
JSF Capabilities Click the diskette symbol at below right of
the User Library and
6.
Click JSF2.0(Apache MyFaces
Core... (You will erase this later on)
7.
Finish
Step 2
1.
Select Project properties ->
JAVA build path
2.
Select JSF2.0(Apache
MyFaces...) and remove it.
3.
Import the PrimeFaces
related libraries into the WEB-INF/lib dir.
javax.faces-2.1.14.jar
jstl-api-1.2.jar
jstl-impl-1.2.jar
primefaces-3.4.2.jar
You may find these on the internet or you may send me a letter for a free
of charge service.
COMMENTS:
1.
Arstest.xhtml basicly uses
<h:form>
<b>Spin a number:</b> <p:spinner value="#{aRSBean.number}"/><br/>
<b>Select a date:</b> <p:calendar value="#{arsBean.date}"/><br/>
<p:commandButton action="#{aRSBean.doAction}"
value="Submit"
ajax="false" />
</h:form>
2.
ars-display-test-result.xhtml basicly uses
<ul>
<li>Entered number:
#{aRSBean.number}</li>
<li>Entered date: #{arsBean.date}</li>
</ul>
COMPLETE
SOURCE:
Index.jsp
------------
<%response.sendRedirect("arstest.jsf"); %>
Arstest.xhtml
-----------------
<!DOCTYPE html
PUBLIC "-//W3C//DTD
XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
xmlns:h=http://java.sun.com/jsf/html
xmlns:p="http://primefaces.org/ui">
<h:head><title>PrimeFaces ARS Test</title>
</h:head>
<h:body>
<div align="center">
<h1 class="ui-widget-header
ui-corner-all" align="center">PrimeFaces ARS Test</h1>
<br/>
<br/>
<p:fieldset legend="PrimeFaces
Basic Functionality Test">
<p> If you see a spinner field to enter a number
and a calendar driven date field,<br/>
if
you can enter a number by spinning the spinner field,<br/>
if
you can enter a date via the calendar,<br/>
if
you can submit these values via clicking the Submit button,<br/>
if
the data entered is reported back correctly on a new page<br/>
<br/>
then<br/>
you
are doing OK, analize this application and continue with the other
examples.<br/>
</p>
<h:form>
<b>Spin a number:</b> <p:spinner value="#{aRSBean.number}"/><br/>
<b>Select a date:</b> <p:calendar value="#{arsBean.date}"/><br/>
<p:commandButton action="#{aRSBean.doAction}"
value="Submit" ajax="false"
/>
</h:form>
</p:fieldset>
</div>
<br/><br/><br/>
<br/><br/><br/><br/><br/><hr/>
<font size="-3">Some of this code
has been designed using <a href="http://www.coreservlets.com/JSF-Tutorial/primefaces/">
Coreservlets PrimeFaces tutorial</a> and <a href="http://www.primefaces.org/showcase/"> PrimeFaces Showcase
material.</a> as a reference. </font>
</h:body></html>
ars-display-test-result.xhtml
-------------------------------------
<!DOCTYPE html
PUBLIC "-//W3C//DTD
XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
xmlns:h="http://java.sun.com/jsf/html">
<h:head><title>ARS Test Result</title>
</h:head>
<h:body>
<h1 class="ui-widget-header
ui-corner-all" align="center">
ARS Test Result</h1>
<p/>
<ul>
<li>Entered number: #{aRSBean.number}</li>
<li>Entered date:
#{aRSBean.date}</li>
</ul>
</h:body></html>
ARSbean.java
------------------
package arsservlets;
import java.util.Date;
import javax.faces.bean.*;
@ManagedBean
public class ARSBean {
private double number;
private Date date;
public double getNumber() {
return (number);
}
public void setNumber(double
number) {
this.number = number;
}
public Date getDate() {
return(date);
}
public void setDate(Date date) {
this.date = date;
}
public String doAction() {
return("ars-display-test-result");
}
}
Web.xml
------------
<?xml version="1.0"
encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" version="2.5">
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.jsf</url-pattern>
</servlet-mapping>
<context-param>
<param-name>javax.faces.PROJECT_STAGE</param-name>
<param-value>Development</param-value>
</context-param>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
<welcome-file>index.html</welcome-file>
</welcome-file-list>
</web-app>
Faces-config.xml
----------------------
----------------------
<?xml version="1.0"?>
<faces-config xmlns="http://java.sun.com/xml/ns/javaee"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd"
version="2.0">
<managed-bean>
<managed-bean-name>arsBean</managed-bean-name>
<managed-bean-class>
arsservlets.ARSBean
</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
</managed-bean>
</faces-config>
3.
IMPORTANT points:
3.1
ARSbean.java uses
annotation.
import javax.faces.bean.*;
@ManagedBean
public class ARSBean {
We can use value="#{aRSBean.number}" in
xhtml files because of this.
3.2
Faces-config.xml file has
<managed-bean>
<managed-bean-name>arsBean</managed-bean-name>
<managed-bean-class>
arsservlets.ARSBean
</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
</managed-bean>
We
can use value="#{arsBean.date}"
because of this manual manage-bean definition.
3.3
Submit button calls the
doAction() function which returns the name of the result screen instead of a
simple string of ‘success’ or ‘fail’.
