JSF2.2でh:commandButtonを実行します。
commandButtonのactionでManagedBean(マネージドビーン)の値で画面遷移します。
※今回はCDIのマネージドビーンを使用しています。
【手順1】
1.「JSF2.2プロジェクトの作成方法」の作成手順で、「JSF22Sample202-h-commandButtonActionBeanValue」といプロジェクトを作成。
※プロジェクトの設定は以下の通り。
※他の項目は任意。
ウィザード名 | 項目名 | 項目に設定する値 |
動的 Web プロジェクト | プロジェクト名 | JSF22Sample202-h-commandButtonActionBeanValue |
ターゲット・ランタイム | GlassFish 4.0 | |
動的 web モジュールバージョン | 3.1 | |
プロジェクト・ファセット | JavaServer Faces | チェック有り バージョン(2.2) |
Java | ビルド・パス上のソース・フォルダー | src |
デフォルト出力フォルダー | build\classes | |
Web モジュール | コンテキスト・ルート | JSF22Sample202-h-commandButtonActionBeanValue |
コンテンツ・ディレクトリー | WebContent | |
web.xml デプロイメント記述子の作成 | チェックあり | |
JSF 機能 | JSF 実装ライブラリー | GlassFish System Library |
Configure JSF servlet in deployment descriptor | チェック有り | |
JSF 構成ファイル | /WEB-INF/faces-config.xml | |
JSF サーブレット名 | Faces Servlet | |
JSF Servlet Class Name | javax.faces.webapp.FacesServlet | |
URL マッピング・パターン | /faces/* |
2.「WebContent/WEB-INF/web.xml」を以下の様に入力。
<?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd" id="WebApp_ID" version="3.1"> <display-name>JSF22Sample202-h-commandButtonActionBeanValue</display-name> <welcome-file-list> <welcome-file>faces/index.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> </web-app>
4.「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
5.「Javaパッケージの作成方法」の手順で、「sample」というパッケージを作成。
6.「Javaクラスファイルの作成方法」の手順で、「SampleBean.java」というクラスファイルを作成。
7.「SampleBean.java」を以下の様に入力。
package sample; import javax.enterprise.context.RequestScoped; import javax.inject.Named; @Named @RequestScoped public class SampleBean { public String action() { System.out.println("actionが呼び出されました。"); return "page2"; } }
8.「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
9.「任意のファイルの作成方法」の手順で、「WebContent/」ディレクトリに「index.xhtml」というファイルを作成。
10.「index.xhtml」を以下の様に入力。
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://xmlns.jcp.org/jsf/html"> <h:head> </h:head> <h:body> <h:outputText value="#{sampleBean.text}" escape="false" /> </h:body> </html>
11.「任意のファイルの作成方法」の手順で、「WebContent/」ディレクトリに「page2.xhtml」というファイルを作成。
12.「page2.xhtml」を以下の様に入力。
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://xmlns.jcp.org/jsf/html"> <h:head> </h:head> <h:body> ページ2です。 </h:body> </html>
13.「Ctrl+Shift+F」を押し、ソースコードをフォーマッティング、「Ctrl+S」でファイルを保存。
14.「動的Webアプリケーションをサーバーに配置する方法」の手順で、作成したプロジェクトをサーバーに配置します。
15.「サーバーをデバッグモードで起動する方法」の手順で、サーバーを起動します。
16.ブラウザで以下のURLにアクセスします。
http://localhost:8080/JSF22Sample202-h-commandButtonActionBeanValue/faces/index.xhtml
17.以下の様に表示されれば成功です。
18.ソースコードは以下の様に出力されていました。(見やすく整形しています)
<html xmlns="http://www.w3.org/1999/xhtml"> <head id="j_idt2"></head> <body> <form id="j_idt4" name="j_idt4" method="post" action="/JSF22Sample202-h-commandButtonActionBeanValue/faces/index.xhtml;jsessionid=99e90060394f2f796831df399a3a" enctype="application/x-www-form-urlencoded"> <input type="hidden" name="j_idt4" value="j_idt4" /> <input type="submit" name="j_idt4:j_idt5" value="移動" /> <input type="hidden" name="javax.faces.ViewState" id="j_id1:javax.faces.ViewState:0" value="2120590524293682529:-6012974635607438027" autocomplete="off" /> </form> </body> </html>
【結論】
「input type="submit"」のボタンが出力されました。
特に画面の遷移先は記載されていません。
サーバ側で処理されると思われます。
以上です。
0 件のコメント:
コメントを投稿
注: コメントを投稿できるのは、このブログのメンバーだけです。