JSF – BackingBean(バッキングビーン)

1月 1, 2003 · Posted in JSF · Comment 

Advertisement


バッキングビーンとは

バッキングビーンとは、UIコンポーネントとのデータ入出力に利用するためのモデルオブジェクトで、POJOなJavaBeansのこと。
(わかりにくいから訂正)バッキングビーンとは、HTMLなどで表示された画面からのデータを受け取ったり、画面にデータを渡したりするためのJavaクラスのこと。データ入出力用のプロパティ(private変数+アクセサメソッド)と、イベント発生時に作動するメソッドを定義することが出来る。

完全なPOJO(Plain Old Java Objedt)なので、フレームワークの制限を受けずに利用することが出来る。

JSF – データバインディング(Data Binding)

1月 1, 2003 · Posted in JSF · Comment 

Advertisement


データバインディング

データバインディング(画面←→Javaクラス)は、バッキングビーンを作成し、UIコンポーネントに設定を記述するだけで、後はJSFのフレームワークが自動的にマッピングしてくれる。

UIコンポーネントのマッピング設定には、value-binding expressionsという式言語を記述する。

サンプルコード

階層
図1:階層
図1:階層

バッキングビーン(DataBinding.java)

package backingbean.databinding;

public class DataBinding {
    private String name;
    private String age;

    public String getAge() {
        return age;
    }
    public void setAge(String age) {
        this.age = age;
    }
    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }

}

JSP(index.jsp)

<%@ page contentType="text/html;charset=Shift_JIS" %>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
<head>
<title>DataBinding</title>
</head>
<body>
<f:view>

<h:form>
入力<br/>
名前:<h:inputText id="name" value="#{DataBindingBean.name}"/><br/>
年齢:<h:inputText id="age" value="#{DataBindingBean.age}"/><br/>
<h:commandButton value="送信"/>
<br/>
<br/>
出力<br/>
名前:<h:outputText id="outputName" value="#{DataBindingBean.name}"/><br/>
年齢:<h:outputText id="outputAge" value="#{DataBindingBean.age}"/>
</h:form>

</f:view>
</body>
</html>

faces-config.xml

<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE faces-config PUBLIC
  &quot;-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.1//EN&quot;
  &quot;http://java.sun.com/dtd/web-facesconfig_1_1.dtd&quot;>

<faces-config>
    <managed-bean>
        <managed-bean-name>DataBindingBean</managed-bean-name>
        <managed-bean-class>backingbean.databinding.DataBinding</managed-bean-class>
        <managed-bean-scope>request</managed-bean-scope>
    </managed-bean>
</faces-config>

web.xml

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

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

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

    <context-param>
        <param-name>javax.faces.CONFIG_FILES</param-name>
        <param-value>/WEB-INF/faces-config.xml</param-value>
    </context-param>

    <taglib>
        <taglib-uri>/tld/jsf-html</taglib-uri>
            <taglib-location>/WEB-INF/tld/html_basic.tld</taglib-location>
        </taglib>
        <taglib>
            <taglib-uri>/tld/jsf-core</taglib-uri>
        <taglib-location>/WEB-INF/tld/jsf_core.tld</taglib-location>
    </taglib>

</web-app>

実行結果
図2:実行結果
図2:実行結果

入力した名前と年齢は、送信ボタンが押下されるとセッターメソッドを経由して、バッキングビーンに格納される。
その後画面が再描画されると、value-binding expressionsの設定にしたがってバッキングビーンから値が取得される。値の取得の際は、ゲッターメソッドが利用される。

JSF – 画面遷移

1月 1, 2003 · Posted in JSF · Comment 

Advertisement


単純な画面の遷移

画面遷移の情報は、faces-config.xmlにnavigation-ruleを記述する。単一の画面遷移はもちろんだが、条件によって異なる遷移先を記述することもできる。

例(faces-config.xml)

<navigation-rule>
    <from-view-id>/pages/flow/index.jsp</from-view-id>
    <navigation-case>
        <from-outcome>success</from-outcome>
        <to-view-id>/pages/flow/result.jsp</to-view-id>
    </navigation-case>
</navigation-rule>

from-view-idには遷移元の画面を記述する。
navigation-case内に、画面遷移時に渡されるパラメータの値(from-outcome)と、それに対応する遷移先の画面(to-view-id)を記述する。

次に、遷移元の画面にfrom-outcomeで指定したパラメータを記述する。

<h:commandButton action="success" value="送信"/>

これにより描画されるボタンを押下したときに、actionの値とfaces-config.xmlの設定を対応付けし、画面遷移が行われる。

サンプルコード

階層
図1:階層
図1:階層

BackingBean(Flow.java)

package backingbean.flow;

public class Flow {
    private String name = null;

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }
}

遷移元JSP(index.jsp)

<%@ page contentType="text/html;charset=Shift_JIS" %>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
<head>
<title>Flow</title>
</head>
<body>
<f:view>

<h:form>
名前を入力して下さい:<h:inputText id="string" value="#{FlowBean.name}"/>
<h:commandButton action="success" value="送信"/>
</h:form>

</f:view>
</body>
</html>

遷移先JSP(result.jsp)

<%@ page contentType="text/html;charset=Shift_JIS" %>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
<head>
<title>Result</title>
</head>
<body>
<f:view>

<h:form>
ようこそ、<h:outputText id="output" value="#{FlowBean.name}"/>!
</h:form>

</f:view>
</body>
</html>

faces-config.xml

<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE faces-config PUBLIC
  "-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.1//EN"
  "http://java.sun.com/dtd/web-facesconfig_1_1.dtd">

<faces-config>
    <navigation-rule>
        <from-view-id>/pages/flow/index.jsp</from-view-id>
        <navigation-case>
            <from-outcome>success</from-outcome>
            <to-view-id>/pages/flow/result.jsp</to-view-id>
        </navigation-case>
    </navigation-rule>

    <managed-bean>
        <managed-bean-name>FlowBean</managed-bean-name>
        <managed-bean-class>backingbean.flow.Flow</managed-bean-class>
        <managed-bean-scope>request</managed-bean-scope>
    </managed-bean>
</faces-config>

web.xml

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

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

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

    <context-param>
        <param-name>javax.faces.CONFIG_FILES</param-name>
        <param-value>/WEB-INF/faces-config.xml</param-value>
    </context-param>

    <taglib>
        <taglib-uri>/tld/jsf-html</taglib-uri>
            <taglib-location>/WEB-INF/tld/html_basic.tld</taglib-location>
        </taglib>
        <taglib>
            <taglib-uri>/tld/jsf-core</taglib-uri>
        <taglib-location>/WEB-INF/tld/jsf_core.tld</taglib-location>
    </taglib>

</web-app>

条件による複数の画面遷移

以下の手順で実行。

次ページへ »