How to pass url parameters to JSF/xHTML? - jsf

I know this has been asked multiple times but mine is a slightly diff question.
I have a JSF page which queries a database and throws results, before i move to JSF, i used to do this in JSP and it was working fine.
When i was using JSP below is the link format i used to use
http://localhost:8080/blmdatabase/index.jsp?SearchString=Name&Category=Contact&Submit=Submit
My index.jsp used to capture the values using param.SearchString & param.Category, and 'Submit' used to activate the 'submit' button for the search.
How do i do the same for xHTML/JSF ?
Here is what i tried ...
http://localhost:8080/blmdatabase/index.xhtml?search=#{some search string}
In my index.xhtml
<td>
<f:metadata>
<f:viewParam name="search" value="#{databaseSearch.searchstring}" />
</f:metadata>
<p:inputText id="searchstring" size="20" maxlength="20" value="#{databaseSearch.searchstring}"/> <p:commandButton id="submit" icon="ui-icon-search" title="Search Database" update="panel" actionListener="#{databaseSearch.customerList}" />
</td>
in my databaseSearch.java
#ManagedBean(name = "databaseSearch")
#SessionScoped
public class databaseSearch implements Serializable {
public String searchstring;
//getter and setter for searchstring
}
Also, i would need it 'Submit' the form .... I am new to this, so please excuse me if this was already discussed before ...
Also if i specific index.html , my jsf components would not load, just a blank page. like if i go
http://localhost:8080/blmdatabase/
my primefaces components load fine, but if i do
http://localhost:8080/blmdatabase/index.xhtml
it does not, so now i am wondering how to pass the parameters :(
Web.xml
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>
<session-config>
<session-timeout>
30
</session-timeout>
</session-config>
<welcome-file-list>
<welcome-file>faces/index.xhtml</welcome-file>
</welcome-file-list>

You could 'submit' your form adding <f:event type="preRenderView"> inside the <f:metadata> tag.
<f:metadata>
<f:viewParam name="search" value="#{databaseSearch.searchstring}" />
<f:event type="preRenderView" listener="#{databaseSearch.doSearch}" />
</f:metadata>
This way, you could implement how your bean will search for this specific query string
public void doSearch(ComponentSystemEvent event) {
if(!searchString.isEmpty()) {
// Do your search here
}
}

Your Faces Servlet maps to anything that's hold in the faces virtual folder:
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>
So http://localhost:8080/blmdatabase/index.xhtml URL won't be parsed through Faces Servlet. You must use http://localhost:8080/blmdatabase/faces/index.xhtml, note the use of faces/ before your index.xhtml file, also note that your <welcome-file> also points to faces/index.xhtml.
The downside of this URL pattern is that Faces Servlet would also process non-facelets resources like JavaScript files (.js), Style files (.css), images (*.png, *.jpg) and others. A better Faces Servlet mapping would be:
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.xhtml</url-pattern>
</servlet-mapping>
In this way, Faces Servlet will process xhtml pages only and you won't need the faces virtual folder anymore. With this change, now you can access to http://localhost:8080/blmdatabase/index.xhtml with no problems.

you could use a method in the class dataBaseSearch:
if(searchString != null){
//execute a query in database
// return result to a variable(resultSet or list)
}
and use getter and setter to get the the resultSet or List
and render the result in a datatable.

Related

Using Primefaces Push to Update Datatable

I'm trying to update a datatable after a row is added using primepush. Meaning, I want user1 to update the datatable and user2 should see the added row without refreshing the page.
My Primefaces version is 5.2 and Atmosphere runtime version is 2.3.3
Here's my relevant code which I tried to implement based on Primefaces Showcase and the User Guide:
web.xml:
<web-app xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
version="3.0">
<display-name>PrimeFaces Web Application</display-name>
<context-param>
<param-name>javax.faces.PROJECT_STAGE</param-name>
<param-value>Development</param-value>
</context-param>
<context-param>
<param-name>javax.faces.DEFAULT_SUFFIX</param-name>
<param-value>.xhtml</param-value>
</context-param>
<welcome-file-list>
<welcome-file>faces/index.xhtml</welcome-file>
</welcome-file-list>
<filter>
<filter-name>AccessFilter</filter-name>
<filter-class>view.AccessFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>AccessFilter</filter-name>
<url-pattern>/secured/*</url-pattern>
</filter-mapping>
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet>
<servlet-name>Push Servlet</servlet-name>
<servlet-class>org.primefaces.push.PushServlet</servlet-class>
<async-supported>true</async-supported>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.jsf</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.faces</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.xhtml</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>Push Servlet</servlet-name>
<url-pattern>/primepush/*</url-pattern>
</servlet-mapping>
</web-app>
Backing Bean:
#ManagedBean
#ViewScoped
#PushEndpoint("/main")
public class MainBean implements Serializable{
...
public void addContact(ActionEvent event){
... // database operations
Contact con = new Contact();
contacts.add(con); // this is an ArrayList
EventBus eventBus = EventBusFactory.getDefault().eventBus();
eventBus.publish("/main", contacts);
}
#OnMessage(encoders = {JSONEncoder.class})
public ArrayList<Contact> getContacts(){
return contacts;
}
}
main.xhtml:
...
<p:commandButton value="Add Contact" update=":form:datatable"
actionListener="#{mainBean.addContact}" ajax="true"/>
<h:form id="form">
<p:dataTable id="datatable" var="contact" value="#{mainBean.contacts}"
selectionMode="single" rowKey="#{contact.firstName}"
selection="#{mainBean.selectedContact}">
<p:column headerText="First Name">
<h:outputText value="#{contact.firstName}"/>
</p:column>
<p:column headerText="Last Name">
<h:outputText value="#{contact.lastName}"/>
</p:column>
</p:dataTable>
</h:form>
<p:socket channel="/main">
<p:ajax event="message" update=":form:datatable"/>
</p:socket>
When I try to add a row to the table, no errors occur but some rows just get lost. When I refresh, the table reloads as the way it should. The added row is also not passed between different users. User2 still needs to refresh to see the changes after user1 adds a value to the table.
I've also tried the suggestions in this link with no success. I'm pretty new to primepush and the examples I found online (other than the User Guide) are for really old versions of Primefaces and push feature seems to changed a lot after Primefaces 5. Any help is appreciated.
Edit: I've also tried these links: link, link, link.
Edit 2: I've logged if the push is working and it seems that it is indeed. When I navigate to the page which has push enabled, I can observe on the console that it gets activated. However, when I try to update the table, the get method of the list which is filling the table is called three times consecutively after pushing...

Why does <h:link> change destination extension from .html to .xhtml?

I'm using JSF 2.1 and I'm experiencing some problems with the <h:link> tag. I'm trying to have the link's outcome point from my XHTML file to a plain HTML file. However, when I run my web application, the .html extension in link's generated URL is automatically converted to a .xhtml extension.
Here is my Facelet file:
<h:body>
<h:form>
<h:link value="animation" outcome="#{contentForm.ccAnimationLink}"/>
</h:form>
<h:body>
Here is my contentForm bean:
package my.app.content;
import java.io.Serializable;
import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ManagedProperty;
import javax.faces.bean.RequestScoped;
#ManagedBean
#RequestScoped
public class ContentForm implements Serializable {
private static final long serialVersionUID = -8463354828156798513L;
private String ccAnimationLink = "";
#PostConstruct
public void init() {
ccAnimationLink = "/content/cc/CC_animation/story.html";
}
public String getCcAnimationLink() {
return ccAnimationLink;
}
public void setCcAnimationLink(String ccAnimationLink) {
this.ccAnimationLink = ccAnimationLink;
}
}
Now, when I run this application, I get the following error:
Unable to find matching navigation case from view ID '/content/modifiedcc.xhtml' for outcome '/content/cc/CC_animation/story.html'
I made sure that I had the URL correct, so I created a story.xhtml file in that location as well. With that file there it runs without errors.
If I pull the source for the generated page, I can see that the <h:link> was correctly changed to an "a href" tag, as follows:
animation
For some reason though the URL changes from story.html, like I have it in my bean, to story.xhtml.
How can I make sure that it stays as story.html and not change it to xhtml?
Here is my web.xml file as well:
<display-name>MyWebApp</display-name>
<context-param>
<param-name>javax.faces.PROJECT_STAGE</param-name>
<param-value>Development</param-value>
</context-param>
<welcome-file-list>
<welcome-file>jsf/login/login.xhtml</welcome-file>
</welcome-file-list>
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.jsf</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.faces</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.xhtml</url-pattern>
</servlet-mapping>
</web-app>
I tried adding the following to the web.xml, this didn't make a difference:
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.html</url-pattern>
</servlet-mapping>
I'm sure this has a very simple solution which I'm just missing right now. Help would be highly appreciated. I hope the question is clear.
JSF 2.0+ has introduced <h:link> component that takes a navigation case outcome in its outcome attribute and autogenerates the right URL on its own. This is why you had the error without adding yet another mapping for the faces servlet: just reread the error. It is useful for creation of inter-JSF application navigation.
Alternatively, there has always been a <h:outputLink> component that takes an URL in its value attribute instead. It is useful for creation of navigation external to a JSF application.
Be sure to read the classics from BalusC on the issue: When should I use h:outputLink instead of h:commandLink?.
That said, consider the following components:
<h:link outcome="/destination" value="link" />
<h:outputLink value="/destination.html">
outputLink
</h:outputLink>
The former component will translate its outcome into an actual URL, by appending a faces servlet mapping, while the latter one will leave its value as-is.
So, your problem will be solved by using the following component:
<h:outputLink value="#{contentForm.ccAnimationLink}">
Animation
</h:outputLink>

fileUpload doesn't fire event in PrimeFaces 3.5 with JSF 2.2

I can't make fileUpload component on PrimeFaces 3.5 to fire the event. I have read many posts about that topic and followed advise there but still it doesn't work. I tried all of the modes (simple, auto, advanced) with no success.
If I use standard inputFile tag from the JSF specification it works properly.
This is my web.xml file:
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="3.1" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd">
<context-param>
<param-name>javax.faces.PROJECT_STAGE</param-name>
<param-value>Development</param-value>
</context-param>
<context-param>
<param-name>primefaces.THEME</param-name>
<param-value>redmond</param-value>
</context-param>
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>
<filter>
<filter-name>PrimeFaces FileUpload Filter</filter-name>
<filter-class>org.primefaces.webapp.filter.FileUploadFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>PrimeFaces FileUpload Filter</filter-name>
<servlet-name>Faces Servlet</servlet-name>
</filter-mapping>
<session-config>
<session-timeout>
30
</session-timeout>
</session-config>
<welcome-file-list>
<welcome-file>faces/home.xhtml</welcome-file>
</welcome-file-list>
</web-app>
And this is part of my view page with the fileUpload tag:
<h:form enctype="multipart/form-data">
<p:dialog id="basicDialog" header="Add pictures" widgetVar="dlg1" >
<p:fileUpload fileUploadListener="#{galleryManagedBean.addPicturesToGallery}" multiple="true"/>
</p:dialog>
</h:form>
The extract from managed bean with the method that is called from the tag:
#Named(value = "galleryManagedBean")
#RequestScoped
public class GalleryManagedBean {
public void addPicturesToGallery(FileUploadEvent event)
{
System.out.println("Triggered upload");
}
}
Also I would like to add that the Http POST request is fired properly after I checked it using the debugger tool in Chrome.
I have added necessary libraries to the classpath i.e. :
commons-fileupload-1.3.jar
commons-io-2.4.jar
This is caused by a change in FacesServlet of JSF 2.2. Since that version, FacesServlet natively supports file uploads (specifically: multipart/form-data HTTP requests) thanks to the presence of the new Servlet 3.0 specific #MultipartConfig annotation. Also, a new <h:inputFile> component was been introduced to offer a file upload component in the standard JSF component set.
This all conflicts with PrimeFaces file upload facility in older PrimeFaces 3.x versions which didn't take this new JSF 2.2 feature into account at all. The PrimeFaces 3.x file upload filter parsed and consumed the entire request while it should leave this job up to the FacesServlet. This caused the FacesServlet to be unable to properly decode the HTTP request (determining the submitted values and actions).
PrimeFaces 4.0, which is designed specifically for JSF 2.2, has taken this all into account. In this changeset of the PrimeFaces file upload filter you can see the changes done to recognize JSF 2.2 and bypass the parsing in the filter. Theoretically, it should also suffice to entirely remove the file upload filter registration from web.xml so that this isn't used anymore.
It should work fine if you upgrade to PrimeFaces 4.0. It has coincidentally been officially released just 2 days ago, so you're pretty on time for that. 

JSF template not applied

I'm running into a problem with JSF and templating. I'm following this tutorial but the only output I see is the one I'm defining in my index.xhtml with
<ui:composition template="/WEB-INF/templates/BasicTemplate.xhtml">
<ui:define name="content">
my custom content
</ui:define>
without adding the footer and header even though I'm not defining/overwriting the default one in my index file.
If I view the source in the browser it's showing up the same way as in my index.xhtml with ui:composition etc. So it looks like it's not "converting" it to HTML.
The relevant parts of my web.xml:
<servlet>
<description>Controller Servlet for data input</description>
<display-name>InputServlet</display-name>
<servlet-name>InputServlet</servlet-name>
<servlet-class>form.controller.InputServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>InputServlet</servlet-name>
<url-pattern>*.jsf</url-pattern>
</servlet-mapping>
<welcome-file-list>
<welcome-file>index.xhtml</welcome-file>
</welcome-file-list>
My directory structure looks like this:
http://i.imgur.com/ZslOQNr.png
Thanks!
You're using the wrong servlet.
JSF comes with its own servlet, the FacesServlet.
Get rid of the InputServlet from web.xml altogether and map JSF's FacesServlet as follows:
<servlet>
<servlet-name>facesServlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>facesServlet</servlet-name>
<url-pattern>*.xhtml</url-pattern>
</servlet-mapping>
That should do it.
See also:
Our JSF wiki page - contains a Hello World and several links to sane tutorials

Basic JSF with Session doesn't work in glassfish

I wanted to test Session replication of session and application scoped beans of JSF 2 in a clustered environment, currently trying with glassfish. To do so I created a simple application that I deployed to the server first to verify it's working (it doesn't).
Here is what I did so far:
Setup a Ubuntu Virtual Machine in Oracle VirtualBox
download glassfish as zip-file and unzip it in the home directory
start glassfish
deploy the JSF-app as war-file
go to the page of the app: localhost:8080/jsftest/index.jsf
try to set a variable saved in session/application scope
Depending on javax.faces.STATE_SAVING_METHOD in web.xml the result:
server: viewExpiredException is thrown
client: value is not stored and default value is shown
To create the app I did the following:
create new dynamic web project in eclipse
unzip all files from myfaces core in WEB-INF/lib
set the classes-folder to WEB-INF/classes
write beans and a .xhtml as below
The session scoped bean (application scoped is similiar):
#ManagedBean(name = "sessbean")
#SessionScoped
public class MySessionScopeBean implements Serializable{
private static final long serialVersionUID = -4733271400646173098L;
private String value = "default session data";
public String getValue() {
return value;
}
public void setValue(String value) {
this.value = value;
}
}
The index.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:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html">
<h:head>
<title>JSF 2.0 Hello World</title>
</h:head>
<h:body>
<h3>JSF 2.0 Hello World Example - hello.xhtml</h3>
<h:outputText value="Session id: #{sessionScope['id']}" />
<h:form>
<h:panelGroup>
<h:outputText value="Session Variable:"/>
<br/>
<h:inputText value="#{sessbean.value}"/>
</h:panelGroup>
<h:commandButton value="submit"/>
</h:form>
<h:form>
<h:panelGroup>
<h:outputText value="Application Variable:"/>
<br/>
<h:inputText value="#{appbean.value}"/>
</h:panelGroup>
<h:commandButton value="submit"/>
</h:form>
</h:body>
</html>
So this very basic example doesn't work. Any suggestions?
Also the Session-ID is not shown by #{sessionScope['id']}, don't know if that is the way to do it.
Got it working by removing parts of the (generated) web.xml file. The working file looks like this:
<?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_3_0.xsd" version="3.0">
<display-name>jsftest</display-name>
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.jsf</url-pattern>
</servlet-mapping>
</web-app>
What I stripped out (don't know which part caused the failure):
<context-param>
<param-name>javax.servlet.jsp.jstl.fmt.localizationContext</param-name>
<param-value>resources.application</param-value>
</context-param>
<context-param>
<description>State saving method: 'client' or 'server' (=default). See JSF Specification 2.5.2</description>
<param-name>javax.faces.STATE_SAVING_METHOD</param-name>
<param-value>client</param-value>
</context-param>
<context-param>
<description>
This parameter tells MyFaces if javascript code should be allowed in
the rendered HTML output.
If javascript is allowed, command_link anchors will have javascript code
that submits the corresponding form.
If javascript is not allowed, the state saving info and nested parameters
will be added as url parameters.
Default is 'true'</description>
<param-name>org.apache.myfaces.ALLOW_JAVASCRIPT</param-name>
<param-value>true</param-value>
</context-param>
<context-param>
<description>
If true, rendered HTML code will be formatted, so that it is 'human-readable'
i.e. additional line separators and whitespace will be written, that do not
influence the HTML code.
Default is 'true'</description>
<param-name>org.apache.myfaces.PRETTY_HTML</param-name>
<param-value>true</param-value>
</context-param>
<context-param>
<param-name>org.apache.myfaces.DETECT_JAVASCRIPT</param-name>
<param-value>false</param-value>
</context-param>
<context-param>
<description>
If true, a javascript function will be rendered that is able to restore the
former vertical scroll on every request. Convenient feature if you have pages
with long lists and you do not want the browser page to always jump to the top
if you trigger a link or button action that stays on the same page.
Default is 'false'
</description>
<param-name>org.apache.myfaces.AUTO_SCROLL</param-name>
<param-value>true</param-value>
</context-param>
<listener>
<listener-class>org.apache.myfaces.webapp.StartupServletContextListener</listener-class>
</listener>

Resources