かんたん開発手順

Conga を使うと，たった４つのステップ ( HTMLの作成， Valueオブジェクトクラスの作成， コントローラ（ビジネスロジック）クラスの作成，リクエスト定義ファイル(XML)の設定 ) だけで，ちゃんと動作する Web アプリケーションを開発することができます。

このサンプルでは，以下のような画面を作ります。

この画面には以下の機能を持たせることにします。

ステップ１　：　HTMLの作成

まず，HTML はこんな感じになります。

<html>
 <head>
  <script type="text/javascript" src="/conga/dhtml/conga.js" charset="UTF-8"></script>
 </head>
 <body>
  <form>
   文字列：<input type="text" name="text" id="text"><br>
   数値：  <input type="text" name="num"  id="num" style="text-align:right"><br>
   日付：  <input type="text" name="date" id="date"><br>
   <input type="button" value="更新" onclick="new CongaRequest().send('test.r')">
  </form>
 </body>
</html>

普通の HTML です。JSPですらありません。
Conga アプリケーションのために必要な記述は以下の2箇所だけです。

  1. 「更新」ボタンのクリック時に，CongaRequest クラスの send メソッドを呼び出して，サーバへの処理依頼を行ないます。
  2. CongaRequest クラスを使用できるようにするために，<script> タグで conga.js を読み込んでおきます。

ステップ２　：　Valueオブジェクトクラスの作成

Value オブジェクトは，画面項目の値を格納するための入れ物です。
この画面には「文字列」，「数値」，「日付」の３項目があるので， それぞれに対応した変数と getter メソッド，setter メソッドを作成します。 

package test.nga.servlet;
import java.util.Date;

public class TestData {
    // 文字列
    private String text;
    public void setText(String text) {this.text = text;}
    public String getText() {return text;}

    // 数値
    private int num;
    public void setNum(int num) {this.num = num;}
    public int getNum() {return num;}

    // 日付
    private Date date;
    public Date getDate() {return date;}
    public void setDate(Date date) {this.date = date;}
}

これもいたって普通の Java Bean な感じのクラスです。
クラス名は何でもかまいませんし，特別なクラスを継承したりする必要もありません。

ステップ３　：　コントローラ（ビジネスロジック）クラスの作成

ビジネスロジッククラスでやるべきことは，ただひとつ「数値項目の値を１プラスして更新すること」です。 

package test.nga.servlet;

public class TestController {

    public void countup(TestData data) {
        data.setNum(data.getNum() + 1);
    }

}

ステップ２で作成した Value オブジェクト TestData を引数として受け取り，数値項目の値に１プラスして再設定する countup というメソッドを作っています。

コントローラも特別なクラスを継承したりする必要はないですし，メソッド名，クラス名に関する制約もありません。

ステップ４　：　リクエスト定義ファイル(XML)の設定

最後にリクエスト定義ファイルを作ります。

このファイルを記述することにより，

といったことができます。

今回は，こんな感じのファイルになります。 

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

<request id="test.r"
         page="test.nga.servlet.TestData"
         controller="test.nga.servlet.TestController.countup">

    <parameter>
        <property name="text" required="true"/>
        <property name="date" format="yyyy/MM/dd"/>
    </parameter>

    <result>
        <target name="text" id="text"/>
        <target name="num"  id="num"  format="#,###"/>
        <target name="date" id="date" format="yyyy/MM/dd"/>
    </result>

</request>
</module>

HTML, Value オブジェクト, コントローラの３者を関連付ける

まずは，「HTML, Value オブジェクト, コントローラの３者の関連付け」ですが，これは，<request> タグの中に記述します。 

<request id="test.r"
         page="test.nga.servlet.TestData"
         controller="test.nga.servlet.TestController.countup">

てな感じです。

入力項目のチェック方法を指定する

入力項目関連の設定は，<parameter> タグによって行ないます。 

    <parameter>
        <property name="text" required="true"/>
        <property name="date" format="yyyy/MM/dd"/>
    </parameter>

parameter タグの中には，入力項目一つ一つに対応する <property> タグを記述し，その属性指定により入力項目のチェック方法を指定することができます。
例えば，「必須入力項目」にしたければ required 属性を true にして，特別な書式に従って入力する必要があるならば，format 属性でその書式を指定します。

なお，property タグの name 属性には，HTML の input タグの name 属性で指定したものと同じものを指定しておきます。
また，name 属性で指定した名前は，Value オブジェクトの getXXX, setXXX の XXX 部分と一致している必要があります。

表示時の書式を指定する

    <result>
        <target name="text" id="text"/>
        <target name="num"  id="num"  format="#,###"/>
        <target name="date" id="date" format="yyyy/MM/dd"/>
    </result>

表示関連の設定は，<result> タグによって行ないます。
result タグの中には，表示する項目一つ一つに対応する <target> タグを記述し，その属性指定により出力項目の書式方法を指定することができます。
ここでは，format 属性の指定により，数値項目をカンマ区切りで表示したり，日付項目を / 区切りであらわしたりしています。

なお，target タグの id 属性には，HTML の input タグの id 属性で指定したものと同じものを指定します。
name 属性で指定した名前は，Value オブジェクトの getXXX, setXXX の XXX 部分と一致している必要があります。

まとめ

以上ですべてです。
ちゃんと動いて，数値も更新されますし，必須入力エラーも表示されるようになります。

定義ファイルの作成に関しては，最初は慣れないかもしれませんが，アプリ作成に必要なタグは殆どこれが全てですし，主要な属性も上記の説明で全て登場しています。

簡単でしょ？

TOP