PrimeFaces - Mobile

 To implement PrimeFaces for mobile you have to do some changes to the implementation.

1. POM
• Add this repository & dependencies

<repository>
         <id>prime-repo</id>
         <name>Prime Repo</name>
          <url>http://repository.primefaces.org</url>   
         <layout>default</layout>
</repository>
<dependency>
         <groupId>org.primefaces</groupId>
         <artifactId>primefaces</artifactId>
         <version>3.3</version>
</dependency>
<dependency>
         <groupId>org.primefaces</groupId>
         <artifactId>primefaces-mobile</artifactId> 
        <version>0.9.3</version>
</dependency>


1. FACES-CONFIG.xml

• Add in the tag<application>
<application> 
         <default-render-kit-id>PRIMEFACES_MOBILE</default-render-kit-id> 
</application>

1. XHTML
• Add in the libraries xmlns:pm="http://primefaces.org/mobile"
 
• Insert the tag <f:view> instead of <h:body>
<f:view xmlns:pm="http://primefaces.org/mobile" contentType="text/html" renderKitId="PRIMEFACES_MOBILE">

• Insert the tag <pm:page>
<pm:page title="Title page">

• Insert the tag <pm:view>
<pm:view id="main">
 
• If you want to display a header in the page, insert <pm:header>
<pm:header title="Mobile" swatch="b"/>
• There are 5 themes (swatch values): "a", "b", "c", "d", "e"
 
• In the <p:inputText> there is an attribute label, so you don´t have to user the <h:outputLabel> element  

• The nature of the tag <f:facet> in different
 
• The tag <p:dataList> works better than  <p:dataTable>