Jsf-page-navigation

提供：Dev Guides
移動先:案内、検索

JSF-ページナビゲーション

ナビゲーションルールは、ボタンまたはリンクがクリックされたときに表示されるビューを記述する、JSFフレームワークによって提供されるルールです。

ナビゲーションルールは、faces-config.xmlという名前のJSF構成ファイルで定義できます。 マネージドBeanで定義できます。

ナビゲーションルールには、結果のビューを表示できる条件に基づいた条件を含めることができます。 JSF 2.0は、ナビゲーションルールを定義する必要のない暗黙的なナビゲーションも提供します。

暗黙的なナビゲーション

JSF 2.0は、暗黙的なナビゲーション*という名前の*自動ビューページリゾルバー*メカニズムを提供します。 この場合、ビュー名をアクション属性に入れるだけで、JSFはデプロイされたアプリケーションで正しい *view ページを自動的に検索します。

JSFホームページ

JSFページの自動ナビゲーション

JSF UIコンポーネントのアクション属性にビュー名を設定します。 

<h:form>
   <h3>Using JSF outcome</h3>
   <h:commandButton action = "page2" value = "Page2"/>
</h:form>

ここで、 Page2 ボタンをクリックすると、JSFはビュー名 page2 をpage2.xhtml拡張子として解決し、現在のディレクトリで対応するビューファイル page2.xhtml を見つけます。

JSFページ2

マネージドBeanの自動ナビゲーション

マネージドBeanでメソッドを定義して、ビュー名を返します。 

@ManagedBean(name = "navigationController", eager = true)
@RequestScoped

public class NavigationController implements Serializable {
   public String moveToPage1() {
      return "page1";
   }
}

マネージドBeanを使用して、JSF UIコンポーネントのアクション属性でビュー名を取得します。 

<h:form>
   <h3> Using Managed Bean</h3>
   <h:commandButton action = "#{navigationController.moveToPage1}"
   value = "Page1"/glt;
</h:form>

ここで、 Page1 ボタンをクリックすると、JSFはビュー名 page1 をpage1.xhtml拡張子として解決し、現在のディレクトリで対応するビューファイル page1.xhtml を見つけます。

JSFページ1

条件付きナビゲーション

マネージドBeanを使用すると、ナビゲーションを非常に簡単に制御できます。 マネージドBeanの次のコードを見てください。

JSF条件付きナビゲーション 

@ManagedBean(name = "navigationController", eager = true)
@RequestScoped

public class NavigationController implements Serializable {
  //this managed property will read value from request parameter pageId
   @ManagedProperty(value = "#{param.pageId}")
   private String pageId;

  //condional navigation based on pageId
  //if pageId is 1 show page1.xhtml,
  //if pageId is 2 show page2.xhtml
  //else show home.xhtml

   public String showPage() {
      if(pageId == null) {
         return "home";
      }

      if(pageId.equals("1")) {
         return "page1";
      }else if(pageId.equals("2")) {
         return "page2";
      }else {
         return "home";
      }
   }
}

JSF UIコンポーネントのリクエストパラメータとしてpageIdを渡します。 

<h:form>
   <h:commandLink action = "#{navigationController.showPage}" value = "Page1">
      <f:param name = "pageId" value = "1"/>
   </h:commandLink>
   <h:commandLink action = "#{navigationController.showPage}" value = "Page2">
      <f:param name = "pageId" value = "2"/>
   </h:commandLink>
   <h:commandLink action = "#{navigationController.showPage}" value = "Home">
      <f:param name = "pageId" value = "3"/>
   </h:commandLink>
</h:form>

ここで、「Page1」ボタンをクリックすると。

  • JSFは、パラメーターpageId = 1でリクエストを作成します
  • 次に、JSFはこのパラメーターをnavigationControllerの管理プロパティpageIdに渡します
  • これで、navigationController.showPage（）が呼び出され、pageIdを確認した後にviewをpage1として返します
  • JSFはビュー名page1をpage1.xhtml拡張子として解決します
  • 現在のディレクトリで対応するビューファイルpage1.xhtmlを見つけます

JSFページ1

from-actionに基づくナビゲーションの解決

マネージドBeanの異なるメソッドが同じビュー名を返す場合でも、JSFはナビゲーション解決オプションを提供します。

アクションからのJSF

マネージドBeanの次のコードを見てください。 

public String processPage1() {
   return "page";
}
public String processPage2() {
   return "page";
}

ビューを解決するには、 faces-config.xml で次のナビゲーションルールを定義します 

<navigation-rule>
   <from-view-id>home.xhtml</from-view-id>

   <navigation-case>
      <from-action>#{navigationController.processPage1}</from-action>
      <from-outcome>page</from-outcome>
      <to-view-id>page1.jsf</to-view-id>
   </navigation-case>

   <navigation-case>
      <from-action>#{navigationController.processPage2}</from-action>
      <from-outcome>page</from-outcome>
      <to-view-id>page2.jsf</to-view-id>
   </navigation-case>

</navigation-rule>

ここで、Page1ボタンがクリックされたとき-

  • * navigationController.processPage1（）*が呼び出され、ページとしてビューが返されます
  • ビュー名は* page1で、 faces-configのfrom-action はnavigationController.processPage1 であるため、JSFはビュー名 *page1 を解決します。
  • 現在のディレクトリで対応するビューファイル page1.xhtml を見つけます。

JSFページ1

フォワードとリダイレクト

デフォルトでは、JSFは別のページにナビゲートしている間にサーバーページを転送し、アプリケーションのURLは変更されません。

ページのリダイレクトを有効にするには、ビュー名の最後に faces-redirect = true を追加します。

JSFフォワードvsリダイレクト 

<h:form>
   <h3>Forward</h3>
   <h:commandButton action = "page1" value = "Page1"/>
   <h3>Redirect</h3>
   <h:commandButton action = "page1?faces-redirect = true" value = "Page1"/>
</h:form>

ここで、 Forward の下の Page1 ボタンをクリックすると、次の結果が得られます。

JSF Page 1 Forward

ここで、リダイレクト*の下の *Page1 ボタンをクリックすると、次の結果が得られます。

JSFページ1リダイレクト

応用例

上記のすべてのナビゲーションの例をテストするために、テストJSFアプリケーションを作成しましょう。

Step Description
1 Create a project with a name helloworld under a package com.finddevguides.test as explained in the JSF - Create Application chapter.
2 Create NavigationController.java under a package com.finddevguides.test as explained below.
3 Create faces-config.xml under a WEB-INF folder and updated its contents as explained below.
4 Update web.xml under a WEB-INF folder as explained below.
5 Create page1.xhtml and page2.xhtml and modify home.xhtml under a webapp folder as explained below.
6 Compile and run the application to make sure business logic is working as per the requirements.
7 Finally, build the application in the form of war file and deploy it in Apache Tomcat Webserver.
8 Launch your web application using appropriate URL as explained below in the last step.

NavigationController.java

package com.finddevguides.test;

import java.io.Serializable;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.ManagedProperty;
import javax.faces.bean.RequestScoped;

@ManagedBean(name = "navigationController", eager = true)
@RequestScoped
public class NavigationController implements Serializable {
   private static final long serialVersionUID = 1L;
   @ManagedProperty(value = "#{param.pageId}")
   private String pageId;

   public String moveToPage1() {
      return "page1";
   }

   public String moveToPage2() {
      return "page2";
   }

   public String moveToHomePage() {
      return "home";
   }

   public String processPage1() {
      return "page";
   }

   public String processPage2() {
      return "page";
   }

   public String showPage() {
      if(pageId == null) {
         return "home";
      }

      if(pageId.equals("1")) {
         return "page1";
      }else if(pageId.equals("2")) {
         return "page2";
      }else {
         return "home";
      }
   }

   public String getPageId() {
      return pageId;
   }

   public void setPageId(String pageId) {
      this.pageId = pageId;
   }
}

faces-config.xml

<?xml version = "1.0" encoding = "UTF-8"?>

<faces-config
   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-facesconfig_2_0.xsd"
   version = "2.0">

   <navigation-rule>
      <from-view-id>home.xhtml</from-view-id>
      <navigation-case>
         <from-action>#{navigationController.processPage1}</from-action>
         <from-outcome>page</from-outcome>
         <to-view-id>page1.jsf</to-view-id>
      </navigation-case>
      <navigation-case>
         <from-action>#{navigationController.processPage2}</from-action>
         <from-outcome>page</from-outcome>
         <to-view-id>page2.jsf</to-view-id>
      </navigation-case>
   </navigation-rule>

</faces-config>

web.xml

<!DOCTYPE web-app PUBLIC
   "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
   "http://java.sun.com/dtd/web-app_2_3.dtd" >

<web-app>
   <display-name>Archetype Created 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.CONFIG_FILES</param-name>
      <param-value>/WEB-INF/faces-config.xml</param-value>
   </context-param>

   <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>

</web-app>

page1.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:body>
      <h2>This is Page1</h2>
      <h:form>
         <h:commandButton action = "home?faces-redirect = true"
            value = "Back To Home Page"/>
      </h:form>
   </h:body>
</html>

page2.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:body>
      <h2>This is Page2</h2>
      <h:form>
         <h:commandButton action = "home?faces-redirect = true"
            value = "Back To Home Page"/>
      </h:form>
   </h:body>
</html>

home.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:body>
      <h2>Implicit Navigation</h2>
      <hr/>

      <h:form>
         <h3>Using Managed Bean</h3>
         <h:commandButton action = "#{navigationController.moveToPage1}"
            value = "Page1"/>
         <h3>Using JSF outcome</h3>
         <h:commandButton action = "page2" value = "Page2"/>
      </h:form>
      <br/>

      <h2>Conditional Navigation</h2>
      <hr/>
      <h:form>
         <h:commandLink action = "#{navigationController.showPage}"
            value="Page1">
            <f:param name = "pageId" value = "1"/>
         </h:commandLink>
              

         <h:commandLink action = "#{navigationController.showPage}"
            value="Page2">
            <f:param name = "pageId" value = "2"/>
         </h:commandLink>
              

         <h:commandLink action = "#{navigationController.showPage}"
            value = "Home">
            <f:param name = "pageId" value = "3"/>
         </h:commandLink>
      </h:form>
      <br/>

      <h2>"From Action" Navigation</h2>
      <hr/>

      <h:form>
         <h:commandLink action = "#{navigationController.processPage1}"
         value = "Page1"/>
              
         <h:commandLink action = "#{navigationController.processPage2}"
         value = "Page2"/>
              
      </h:form>
      <br/>

      <h2>Forward vs Redirection Navigation</h2>
      <hr/>
      <h:form>
         <h3>Forward</h3>
         <h:commandButton action = "page1" value = "Page1"/>
         <h3>Redirect</h3>
         <h:commandButton action = "page1?faces-redirect = true"
         value = "Page1"/>
      </h:form>
   </h:body>
</html>

すべての変更を完了したら、JSF-アプリケーションの作成の章で行ったようにアプリケーションをコンパイルして実行します。 すべてがアプリケーションで問題ない場合、次の結果が生成されます。

JSFナビゲーション

「https://www.finddevguides.com/index.php?title=Jsf-page-navigation&oldid=20361」から取得
Powered by MediaWiki