Hidden Value Example with JSF 2.0
In this example, we are going to demonstrate a simple way to implement a hidden value field in JSF. Hidden value fields, are used to submit data that are not inserted and authorised from the user. Some years ago (J2EE 1.4), a hidden value field was one of the three techniques that were used to implement web sessions.
In JSF, we can use the <h:inputHidden />
tag, in order to render an HTML hidden value field. For example, the JSF tag <h:inputHidden value="sample text" />
will render back, this HTML tag expression:
<input type="hidden" name="random value" value="some text" />
. By the end of this example, you will be able to render hidden value fields through <h:inputHidden />
tag and to also access the hidden values of them, with Javascript.
1. Managed Bean
Our usual, simple Managed Bean, declared as “user”.
UserBean.java
package com.javacodegeeks.enterprise.jsf.hiddenvalue; import java.io.Serializable; import javax.faces.bean.ManagedBean; import javax.faces.bean.SessionScoped; @ManagedBean(name="user") @SessionScoped public class UserBean implements Serializable{ private static final long serialVersionUID = 7134492943336358840L; String answer = "Hi from hidden value!"; public String getAnswer() { return answer; } public void setAnswer(String answer) { this.answer = answer; } }
2. Our Page
Its scope is to render a hidden value through the fore-mentioned JSF tag and if a button event occurs, then it has to print the value of our hidden field; as we already said, this will be implemented with Javascript.
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:h="http://java.sun.com/jsf/html"> <h:head> <title>JSF Hidden Value Example</title> <script type="text/javascript"> function printHiddenValue() { alert(document.getElementById('simpleform:hiddenID').value); } </script> </h:head> <h:body> <h1>JSF 2.0 Hidden Value Example</h1> <h:form id="simpleform"> <h:inputHidden value="#{user.answer}" id="hiddenID" /> <h:commandButton value="Click Me!" onclick="printHiddenValue()" /> </h:form> </h:body> </html>
3. Demo
Another very simple example, let’s try to run our application by accessing http://localhost:8080/HiddenValueJSF
; if everything goes right, after clicking the button under our page’s heading, we should get something like this:
This was an example of Hidden Value in JSF 2.0. You can also download the source code for this example: HiddenValueJSF