JSF(JavaServer Faces)関連
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
検索
|
最終更新
|
ヘルプ
|
ログイン
] [
Twitter
]
開始行:
→Java関連
→JBoss Seam関連
→[[JSP関連]]
#contents
*概要 [#q19dc5fa]
-JSFはWebアプリケーションのインターフェイスを構築するため...
-JSFはMVCにおけるVとCの機能を提供する
--View→JSFのタグライブラリで拡張されたJSPを用いてWebイン...
--Control→Managed Beanと設定ファイルによってコントローラ...
--Model→EJB
---Entityはデータモデル
---SessionBeanはイベントリスナー
--JSFでは画面から受け取ったアクションをfaces-config.xmlで...
---※追記:バッキングBeanはもともとマネージドBeanの属性に...
--ビジネスロジックの実装にEJB3を使用する場合、Managed Bea...
--JavaEE5ではJSFとEJBをつなぐ標準の方法が用意されていない
--そこでJBoss Seamが登場し、両者を統合、管理してシームレ...
--JBoss SeamではManaged Beanの設定を外部ファイルでなくソ...
--Seamコンポーネントを自動的に適切なManaged Beanにマッピ...
--「JSF (JavaServer Faces)」は、ユーザによりブラウザ等で...
--Strutsは画面遷移(MVCモデルのC)に強いのに対して、JSFはユ...
-JSFの特徴
--Webアプリケーションのフォームを簡単に開発可能
--UIとデータのやり取りを簡単に実現
--UIコンポーネントに入力されたデータの型変換、妥当性チェ...
--ページ間の画面遷移をXMLで一括管理可能(Strutsと同様)
--UIコンポーネントとビジネスロジックを分離開発可能
*関連Web [#m7abc452]
-http://java.sun.com/javaee/javaserverfaces/
-[[JamesHolmes.com Java Server Faces Resources >http://ww...
-http://www.jsfcentral.com/
-[[Oracle ADF:http://www.oracle.com/technology/products/a...
--Oracle ADF Faces is a rich set of user interface compon...
-[[Faces Console>http://www.jamesholmes.com/JavaServerFac...
--The Faces Console is a FREE standalone Java Swing appli...
--The Faces Console also plugs into multiple, popular Jav...
*解説記事 [#efcc8cb4]
-[[JSF ライフサイクルはソース見るのが手っ取り早い>http://...
-[[JSF2.0 Ajaxで部分レンダリング>http://jarngreipr.blog10...
--<f:ajax>タグ
--execute属性でサーバにPOSTするコンポーネントのIDを指定
--親タグのIDを指定すれば子タグのIDは指定する必要はない
--render属性で通信後に再描画するコンポーネントのIDを指定
--onevent属性で通信前後に実行するjavascriptのファンクショ...
--renderやexecuteに指定可能なのはJSFコンポーネントのIDでJ...
--executeやrender属性の指定では、f:ajaxが所属しているform...
--ManagedBean内の@PostConstructを指定されたメソッドが必ず...
-[[JSFのデバッグって…?>http://kikutaro777.hatenablog.com...
--<ui:debug>の使い方など
-[[JSFをきちんと理解しよう。>http://qiita.com/san_yamagam...
--ライフサイクルをきちんと理解することが非常に重要
--タグ属性を正確に理解する
-[[JSF MyFacesを使ってみる>http://muimi.com/j/jsf/myfaces...
--MyFacesはオープンソースのJSF実装です
--http://www.myfaces.org/
-[[JSF入門>http://dream.mods.jp/first_jsf/part1.html]]
-[[JSFがくる>http://muimi.com/j/jsf/]]
-[[JSFによるWebアプリケーション開発>http://www.wakhok.ac....
--Managed Bean = Backing Bean
--Managed Beanとは、アプリケーションのWeb層とビジネス層の...
-[[JSFの構造を探る:http://www.atmarkit.co.jp/fjava/specia...
--コンポーネントタグライブラリ(UIのJSPカスタムタグライブ...
--コアタグライブラリ(イベントハンドラ、バリデータ、コンバ...
--サーバサイドでステートフルオブジェクトとして表現されるUI
--イベントハンドラ、バリデータ、コンバータ
--JavaBean(データモデル=モデルオブジェクト)
--サーバサイドヘルパークラス
--JSFページ
-[[JavaServer Facesを理解する>http://www.atmarkit.co.jp/f...
--[[(後編)>http://www.atmarkit.co.jp/fjava/special/jsf02/...
-[[JSF紹介>http://www.iplatform.org/develop/jsf/jsf.htm]]
*タグライブラリ [#a58bec60]
-JSFのタグライブラリはHTMLタグとcoreタグに別れる
-HTMLタグ
--HTML生成を行う
--ネームスペース <h:〜 で表される
-coreタグ
--HTMLと直接関連しないユーティリティを提供?
--ネームスペース <f:〜 で表される
**自前Converterタグライブラリを作る例 [#s04dade5]
import java.text.SimpleDateFormat;
import java.util.Calendar;
import java.util.GregorianCalendar;
import java.util.Locale;
import javax.faces.component.UIComponent;
import javax.faces.context.FacesContext;
import javax.faces.convert.Converter;
public class MyFormatConverter implements Converter {
public Object getAsObject(FacesContext context, UICompo...
// valueをコンバートしたObjectを返す
}
public String getAsString(FacesContext context, UICompo...
// valueをコンバートした Stringを返す
}
}
-使用例
<h:outputText
value="#{hogeCompo.hogeValue}"
converter="myFormatConverter" />
*Facelets [#de5991af]
-[[Facelets Developer Documentation>https://facelets.dev....
-[[Faceletsとは>http://journal.mycom.co.jp/special/2006/s...
--FaceletsはJSFアプリケーションを作成するためのフレームワ...
--Faceletsを使用することで、JSFのビューに対してテンプレー...
--JSPコンテナに依存しない
--ネームスペース <ui:〜 で表される
**<ui:fragment>を使ってタグのレンダリングを制御 [#j8df3940]
-既存のhtmlタグをjsfで手っ取り早く表示非表示制御するには<...
**ui:compositionのtemplate属性の使い方 [#gc578455]
-ページの全体デザインのテンプレートみたいなページを用意し...
-ui:composition のtemplate属性にその(テンプレートとなる)...
-以下のようになることが多い
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:s="http://jboss.com/products/seam/taglib"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:a="https://ajax4jsf.dev.java.net/ajax"
xmlns:rich="http://richfaces.ajax4jsf.org/rich"
template="/layout/template.xhtml">
-/layout/template.xhtml側では、適当にページをデザインした...
<ui:insert name="body"/>
などと書いておく。nameの値は任意。
-テンプレートを呼び出す側のページにはui:insertの場所に差...
<ui:define name="body">
(〜適当に差し込みたい中身)
</ui:define>
-ここでui:insertに指定したnameと同じnameでui:defineするこ...
-名前が違うとスルーされてテンプレートの中に何も表示されな...
-つまり、テンプレートを適用される側のページは、
<ui:composition ...
template="/layout/template.xhtml">
<ui:define name="body">
...
(〜適当に差し込みたい中身)
...
</ui:define>
</ui:composition>
と言う感じになる。
-参考になるページ:http://otjwave.itbdns.com/~okamura/Seam...
*faces-config.xml [#ld811e31]
-jsfのメイン設定ファイル
-WEB-INF直下におかれる
-以下のようなものを設定する
--Managed Bean定義
--ナビゲーション=画面遷移
--ロケール
-[[Conditional Navigation Rule in JSF 2.0>http://www.mkyo...
--faces-config.xml で条件付遷移の記述が可能な例
<navigation-rule>
<from-view-id>start.xhtml</from-view-id>
<navigation-case>
<from-outcome>payment</from-outcome>
<if>#{paymentController.orderQty < 100}</if>
<to-view-id>ordermore.xhtml</to-view-id>
</navigation-case>
<navigation-case>
<from-outcome>payment</from-outcome>
<if>#{paymentController.registerCompleted}</if>
<to-view-id>payment.xhtml</to-view-id>
</navigation-case>
<navigation-case>
<from-outcome>payment</from-outcome>
<to-view-id>register.xhtml</to-view-id>
</navigation-case>
</navigation-rule>
*Tips [#scbb8086]
-[[JSFでJavaScriptのwindow.openを利用する>http://akuneshi...
<script>
function launchPopUp() {
<c:if test="${param.popup != ''}">
window.open(<c:out value="/jsp/${param.popup}"/>);
</c:if>
};
</script>
<body onLoad="launchPopUp();"/>
<h:form>
<input type="hidden" name="popup" value=""/>
<h:commandButton action="#{bean.action}" onClick="docum...
</h:form>
-[[JSF 2.2ではf:eventのpreRenderViewではなくf:viewAction...
-[[JSFでバッキングBeanに@PostConstructを付けたメソッドが...
--解決1:FacesContext#isPostback()==falseのときだけ初期...
--解決2:@ViewScoped にする
--解決2の方が自然な解決法のように思われる
-[[JSFでactionListener内の判定結果に応じてactionの画面遷...
--actionListenerで判定して、その結果、actionの画面遷移を...
-[[ブックマーク可能な URL (GET リクエスト) のサポートと動...
-JSFのBeanメソッドへのリンクにGETパラメータを付ける
<s:link action="#{hogeBean.hoge()}" value="hoge">
<f:param name="hogeParam" value="xxx" />
</s:link>
-すべてのJSFツリーの起点には<f:view>タグが必要
終了行:
→Java関連
→JBoss Seam関連
→[[JSP関連]]
#contents
*概要 [#q19dc5fa]
-JSFはWebアプリケーションのインターフェイスを構築するため...
-JSFはMVCにおけるVとCの機能を提供する
--View→JSFのタグライブラリで拡張されたJSPを用いてWebイン...
--Control→Managed Beanと設定ファイルによってコントローラ...
--Model→EJB
---Entityはデータモデル
---SessionBeanはイベントリスナー
--JSFでは画面から受け取ったアクションをfaces-config.xmlで...
---※追記:バッキングBeanはもともとマネージドBeanの属性に...
--ビジネスロジックの実装にEJB3を使用する場合、Managed Bea...
--JavaEE5ではJSFとEJBをつなぐ標準の方法が用意されていない
--そこでJBoss Seamが登場し、両者を統合、管理してシームレ...
--JBoss SeamではManaged Beanの設定を外部ファイルでなくソ...
--Seamコンポーネントを自動的に適切なManaged Beanにマッピ...
--「JSF (JavaServer Faces)」は、ユーザによりブラウザ等で...
--Strutsは画面遷移(MVCモデルのC)に強いのに対して、JSFはユ...
-JSFの特徴
--Webアプリケーションのフォームを簡単に開発可能
--UIとデータのやり取りを簡単に実現
--UIコンポーネントに入力されたデータの型変換、妥当性チェ...
--ページ間の画面遷移をXMLで一括管理可能(Strutsと同様)
--UIコンポーネントとビジネスロジックを分離開発可能
*関連Web [#m7abc452]
-http://java.sun.com/javaee/javaserverfaces/
-[[JamesHolmes.com Java Server Faces Resources >http://ww...
-http://www.jsfcentral.com/
-[[Oracle ADF:http://www.oracle.com/technology/products/a...
--Oracle ADF Faces is a rich set of user interface compon...
-[[Faces Console>http://www.jamesholmes.com/JavaServerFac...
--The Faces Console is a FREE standalone Java Swing appli...
--The Faces Console also plugs into multiple, popular Jav...
*解説記事 [#efcc8cb4]
-[[JSF ライフサイクルはソース見るのが手っ取り早い>http://...
-[[JSF2.0 Ajaxで部分レンダリング>http://jarngreipr.blog10...
--<f:ajax>タグ
--execute属性でサーバにPOSTするコンポーネントのIDを指定
--親タグのIDを指定すれば子タグのIDは指定する必要はない
--render属性で通信後に再描画するコンポーネントのIDを指定
--onevent属性で通信前後に実行するjavascriptのファンクショ...
--renderやexecuteに指定可能なのはJSFコンポーネントのIDでJ...
--executeやrender属性の指定では、f:ajaxが所属しているform...
--ManagedBean内の@PostConstructを指定されたメソッドが必ず...
-[[JSFのデバッグって…?>http://kikutaro777.hatenablog.com...
--<ui:debug>の使い方など
-[[JSFをきちんと理解しよう。>http://qiita.com/san_yamagam...
--ライフサイクルをきちんと理解することが非常に重要
--タグ属性を正確に理解する
-[[JSF MyFacesを使ってみる>http://muimi.com/j/jsf/myfaces...
--MyFacesはオープンソースのJSF実装です
--http://www.myfaces.org/
-[[JSF入門>http://dream.mods.jp/first_jsf/part1.html]]
-[[JSFがくる>http://muimi.com/j/jsf/]]
-[[JSFによるWebアプリケーション開発>http://www.wakhok.ac....
--Managed Bean = Backing Bean
--Managed Beanとは、アプリケーションのWeb層とビジネス層の...
-[[JSFの構造を探る:http://www.atmarkit.co.jp/fjava/specia...
--コンポーネントタグライブラリ(UIのJSPカスタムタグライブ...
--コアタグライブラリ(イベントハンドラ、バリデータ、コンバ...
--サーバサイドでステートフルオブジェクトとして表現されるUI
--イベントハンドラ、バリデータ、コンバータ
--JavaBean(データモデル=モデルオブジェクト)
--サーバサイドヘルパークラス
--JSFページ
-[[JavaServer Facesを理解する>http://www.atmarkit.co.jp/f...
--[[(後編)>http://www.atmarkit.co.jp/fjava/special/jsf02/...
-[[JSF紹介>http://www.iplatform.org/develop/jsf/jsf.htm]]
*タグライブラリ [#a58bec60]
-JSFのタグライブラリはHTMLタグとcoreタグに別れる
-HTMLタグ
--HTML生成を行う
--ネームスペース <h:〜 で表される
-coreタグ
--HTMLと直接関連しないユーティリティを提供?
--ネームスペース <f:〜 で表される
**自前Converterタグライブラリを作る例 [#s04dade5]
import java.text.SimpleDateFormat;
import java.util.Calendar;
import java.util.GregorianCalendar;
import java.util.Locale;
import javax.faces.component.UIComponent;
import javax.faces.context.FacesContext;
import javax.faces.convert.Converter;
public class MyFormatConverter implements Converter {
public Object getAsObject(FacesContext context, UICompo...
// valueをコンバートしたObjectを返す
}
public String getAsString(FacesContext context, UICompo...
// valueをコンバートした Stringを返す
}
}
-使用例
<h:outputText
value="#{hogeCompo.hogeValue}"
converter="myFormatConverter" />
*Facelets [#de5991af]
-[[Facelets Developer Documentation>https://facelets.dev....
-[[Faceletsとは>http://journal.mycom.co.jp/special/2006/s...
--FaceletsはJSFアプリケーションを作成するためのフレームワ...
--Faceletsを使用することで、JSFのビューに対してテンプレー...
--JSPコンテナに依存しない
--ネームスペース <ui:〜 で表される
**<ui:fragment>を使ってタグのレンダリングを制御 [#j8df3940]
-既存のhtmlタグをjsfで手っ取り早く表示非表示制御するには<...
**ui:compositionのtemplate属性の使い方 [#gc578455]
-ページの全体デザインのテンプレートみたいなページを用意し...
-ui:composition のtemplate属性にその(テンプレートとなる)...
-以下のようになることが多い
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:s="http://jboss.com/products/seam/taglib"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:a="https://ajax4jsf.dev.java.net/ajax"
xmlns:rich="http://richfaces.ajax4jsf.org/rich"
template="/layout/template.xhtml">
-/layout/template.xhtml側では、適当にページをデザインした...
<ui:insert name="body"/>
などと書いておく。nameの値は任意。
-テンプレートを呼び出す側のページにはui:insertの場所に差...
<ui:define name="body">
(〜適当に差し込みたい中身)
</ui:define>
-ここでui:insertに指定したnameと同じnameでui:defineするこ...
-名前が違うとスルーされてテンプレートの中に何も表示されな...
-つまり、テンプレートを適用される側のページは、
<ui:composition ...
template="/layout/template.xhtml">
<ui:define name="body">
...
(〜適当に差し込みたい中身)
...
</ui:define>
</ui:composition>
と言う感じになる。
-参考になるページ:http://otjwave.itbdns.com/~okamura/Seam...
*faces-config.xml [#ld811e31]
-jsfのメイン設定ファイル
-WEB-INF直下におかれる
-以下のようなものを設定する
--Managed Bean定義
--ナビゲーション=画面遷移
--ロケール
-[[Conditional Navigation Rule in JSF 2.0>http://www.mkyo...
--faces-config.xml で条件付遷移の記述が可能な例
<navigation-rule>
<from-view-id>start.xhtml</from-view-id>
<navigation-case>
<from-outcome>payment</from-outcome>
<if>#{paymentController.orderQty < 100}</if>
<to-view-id>ordermore.xhtml</to-view-id>
</navigation-case>
<navigation-case>
<from-outcome>payment</from-outcome>
<if>#{paymentController.registerCompleted}</if>
<to-view-id>payment.xhtml</to-view-id>
</navigation-case>
<navigation-case>
<from-outcome>payment</from-outcome>
<to-view-id>register.xhtml</to-view-id>
</navigation-case>
</navigation-rule>
*Tips [#scbb8086]
-[[JSFでJavaScriptのwindow.openを利用する>http://akuneshi...
<script>
function launchPopUp() {
<c:if test="${param.popup != ''}">
window.open(<c:out value="/jsp/${param.popup}"/>);
</c:if>
};
</script>
<body onLoad="launchPopUp();"/>
<h:form>
<input type="hidden" name="popup" value=""/>
<h:commandButton action="#{bean.action}" onClick="docum...
</h:form>
-[[JSF 2.2ではf:eventのpreRenderViewではなくf:viewAction...
-[[JSFでバッキングBeanに@PostConstructを付けたメソッドが...
--解決1:FacesContext#isPostback()==falseのときだけ初期...
--解決2:@ViewScoped にする
--解決2の方が自然な解決法のように思われる
-[[JSFでactionListener内の判定結果に応じてactionの画面遷...
--actionListenerで判定して、その結果、actionの画面遷移を...
-[[ブックマーク可能な URL (GET リクエスト) のサポートと動...
-JSFのBeanメソッドへのリンクにGETパラメータを付ける
<s:link action="#{hogeBean.hoge()}" value="hoge">
<f:param name="hogeParam" value="xxx" />
</s:link>
-すべてのJSFツリーの起点には<f:view>タグが必要
ページ名: