이 콘텐츠는 선택한 언어로 제공되지 않습니다.

4.5. State Manager API


JSF has an advanced navigation mechanism that lets you define navigation from view to view. In a web application, navigation occurs when a user changes from one page to another by clicking on a button, a hyperlink, or another command component. There is no switch mechanism between some logical states of the same view. For example, in Login/Register dialog, an existing user signs in with his user name and password, but if a new user attempts to register, an additional field (Confirm) is displayed, and button labels and methods are changed when the user clicks the To register link:

Figure 4.7.  Login Dialog

Figure 4.8.  Register Dialog

RichFaces State API lets you easily define a set of states for pages, and properties for these states.
The States class interfaces with a map, where the keySet defines the State name and the entrySet is a State map. The State map defines the properties, method bindings, or constant state variables of a key or object, where these values may change depending on the active State.

Figure 4.9.  RichFaces State API

One of the most convenient features of the RichFaces State API is the ability to navigate between States. The API implements changes in State through standard JSF navigation. When the action component returns an outcome, the JSF navigation handler (extended through the RichFaces State API) checks whether the outcome is registered as a State change outcome. If true, the corresponding State is activated. If false, standard navigation handling is called.
Implement the RichFaces State API like so:
  • Register the State Navigation Handler and the EL Resolver in your faces-config.xml file:
    ...
    <application>
    	<navigation-handler>org.richfaces.ui.application.StateNavigationHandler</navigation-handler>
    	<el-resolver>org.richfaces.el.StateELResolver</el-resolver>
    </application>
    ...
    Copy to Clipboard Toggle word wrap
  • Register an additional application factory in the faces-config.xml:
    ...
    <factory>
    	<application-factory>org.richfaces.ui.application.StateApplicationFactory</application-factory>
    </factory>
    ...
    Copy to Clipboard Toggle word wrap
  • Register two managed beans in the faces-config.xml:
    ...
    <managed-bean>
    	<managed-bean-name>state</managed-bean-name>
    	<managed-bean-class>org.richfaces.ui.model.States</managed-bean-class>
    	<managed-bean-scope>request</managed-bean-scope>
    	<managed-property>
    		<property-name>states</property-name>
    		<property-class>org.richfaces.ui.model.States</property-class>
    		<value>#{config.states}</value>
    	</managed-property>
    </managed-bean>
    <managed-bean>
    	<managed-bean-name>config</managed-bean-name>
    	<managed-bean-class>org.richfaces.demo.stateApi.Config</managed-bean-class>
    	<managed-bean-scope>none</managed-bean-scope>
    </managed-bean>
    ...
    Copy to Clipboard Toggle word wrap
    One bean (config) defines and stores State as seen in the following example:
    ...
    public class Config {
    
    	/**
    	 * @return States
    	 */
    	public States getStates() {
    		FacesContext facesContext = FacesContext.getCurrentInstance();
    		States states = new States();
    
    		// Registering new User State definition
    		states.setCurrentState("register"); // Name of the new state
    
    		// Text labels, properties and Labels for controls in "register" state
    		states.put("showConfirm", Boolean.TRUE); // confirm field rendering
    		states.put("link", "(To login)"); // Switch State link label
    		states.put("okBtn", "Register"); // Login/Register button label
    		states.put("stateTitle", "Register New User"); // Panel title
    
    		ExpressionFactory expressionFactory = facesContext.getApplication()
    				.getExpressionFactory();
    
    		// Define "registerbean" available under "bean" EL binding on the page
    		ValueExpression beanExpression = expressionFactory
    				.createValueExpression(facesContext.getELContext(),
    						"#{registerbean}", Bean.class);
    		states.put("bean", beanExpression);
    
    		// Define "registeraction" available under "action" EL binding on the
    		// page
    		beanExpression = expressionFactory.createValueExpression(facesContext
    				.getELContext(), "#{registeraction}", RegisterAction.class);
    		states.put("action", beanExpression);
    
    		// Define method expression inside registeraction binding for this state
    		MethodExpression methodExpression = expressionFactory.createMethodExpression(
    				facesContext.getELContext(), "#{registeraction.ok}",
    				String.class, new Class[] {});
    		states.put("ok", methodExpression);
    
    		// Outcome for switching to login state definition
    		states.setNavigation("switch", "login");
    
    		// Login Existent User State analogous definition
    		states.setCurrentState("login");
    		states.put("showConfirm", Boolean.FALSE);
    		states.put("link", "(To register)");
    		states.put("okBtn", "Login");
    		states.put("stateTitle", "Login Existing User");
    
    		beanExpression = expressionFactory.createValueExpression(facesContext
    				.getELContext(), "#{loginbean}", Bean.class);
    		states.put("bean", beanExpression);
    
    		beanExpression = expressionFactory.createValueExpression(facesContext
    				.getELContext(), "#{loginaction}", LoginAction.class);
    		states.put("action", beanExpression);
    
    		methodExpression = expressionFactory.createMethodExpression(
    				facesContext.getELContext(), "#{loginaction.ok}",
    				String.class, new Class[] {});
    		states.put("ok", methodExpression);
    
    		states.setNavigation("switch", "register");
    
    		return states;
    	}
    }
    ...
    Copy to Clipboard Toggle word wrap
    The second bean, with the org.richfaces.ui.model.States type (state), contains the managed property states, which is bound to the first config bean.
  • Next, use state bindings on the page, as in the following example:
    ...
    <h:panelGrid columns="3">
    	<h:outputText value="username" />
    	<h:inputText value="#{state.bean.name}" id="name" required="true" />
    	<h:outputText value="password" />
    	<h:inputSecret value="#{state.bean.password}" id="password" required="true" />
    	<h:outputText value="confirm" rendered="#{state.showConfirm}" />
    	<h:inputSecret value="#{state.bean.confirmPassword}" rendered="#{state.showConfirm}" id="confirm" required="true" />
    </h:panelGrid>
    <a4j:commandButton actionListener="#{state.action.listener}" action="#{state.ok}" value="#{state.okBtn}" id="action"/>
    ...
    Copy to Clipboard Toggle word wrap
To see complete example of the Login/Register dialog, see the RichFaces Live Demo.
맨 위로 이동
Red Hat logoGithubredditYoutubeTwitter

자세한 정보

평가판, 구매 및 판매

커뮤니티

Red Hat 문서 정보

Red Hat을 사용하는 고객은 신뢰할 수 있는 콘텐츠가 포함된 제품과 서비스를 통해 혁신하고 목표를 달성할 수 있습니다. 최신 업데이트를 확인하세요.

보다 포괄적 수용을 위한 오픈 소스 용어 교체

Red Hat은 코드, 문서, 웹 속성에서 문제가 있는 언어를 교체하기 위해 최선을 다하고 있습니다. 자세한 내용은 다음을 참조하세요.Red Hat 블로그.

Red Hat 소개

Red Hat은 기업이 핵심 데이터 센터에서 네트워크 에지에 이르기까지 플랫폼과 환경 전반에서 더 쉽게 작업할 수 있도록 강화된 솔루션을 제공합니다.

Theme

© 2026 Red Hat