Quick Startfor Web Application
2.5. 処理フローの定義

2.3、2.4で作成した、ユーザ編集画面、ユーザ一覧表示画面にイベントハンドラを定義し、処理を定義します。

2.5.1. ユーザ編集画面のイベントハンドラ定義
  1. Eclipseでfalcon_web_tutorial/WEB-INF/falcon/app.xmlファイル(以下app.xmlファイル 81行目あたりから)を開き、リスト 2-7のように修正を行います。 
    
    <w:menu name="menu" template="titlemenu">
    </w:menu>

    <w:panel name="mainPanel">
        <w:unit name="userList" initial="userList"/>
        
        <w:event command="afterEditUser">
            <w:updateWidget name="userList"/>
            <w:deleteWidget name="userForm"/>
        </w:event>
        <!-- ↑データベースのデータ変更(追加、更新、削除)時、
        ユーザ一覧表示画面の表示内容を更新し、
        ユーザ編集画面を非表示にします。
		-- >
		
        <w:event command="afterCancelUser">
            <w:deleteWidget name="userForm"/>
        </w:event>
        <!-- ↑キャンセルボタン押下時の
        ユーザ編集画面を非表示にします。 -->
		
		
    </w:panel>

    <w:form name="userForm">
        <w:dataSource dao="userMap"/>
        <w:field header="ユーザID" name="user_id"
            type="text" maxlength="128" size="40"/>
        <w:field header="パスワード" name="password"
            type="password" maxlength="128" size="40"/>
        <w:field header="名前" name="user_name"
            type="text" maxlength="128" size="40"/>
        <w:field header="メールアドレス" name="mail"
            type="text" maxlength="128" size="40"/>
        <w:field header="郵便番号" name="zip"
            type="text" maxlength="7" size="10"/>
        <w:field header="住所" name="address"
            type="textarea" col="40" row="5"/>
        <w:field header="電話番号" name="tel"
            type="text" maxlength="11" size="10"/>
        <w:field header="誕生日" name="birthday"
            type="text" maxlength="8" size="10"/>
        <w:commandBox name="edit">
            <w:insert type="button" text="追加"/>
            <w:update type="button" text="更新"/>
            <w:delete type="button" text="削除"/>
            <w:ok type="button" text="OK"/>
            <w:cancel type="button" text="キャンセル"/>
        </w:commandBox>
		
        <!-- ↓データベースにデータ追加時のイベント定義です。 -->
        <w:event command="afterInsert">
            <w:fireEvent command="afterEditUser"/>
        </w:event>
        <!-- ↓データベースにデータ更新時のイベント定義です。-->
        <w:event command="afterUpdate">
            <w:fireEvent command="afterEditUser"/>
        </w:event>
        <!-- ↓データベースにデータ削除時のイベント定義です。 -->
        <w:event command="afterDelete">
            <w:fireEvent command="afterEditUser"/>
        </w:event>
        <!-- ↓キャンセルボタン押下時のイベント定義です。-->
        <w:event command="afterCancelInsert">
            <w:fireEvent command="afterCancelUser"/>
        </w:event>
        <!-- ↓キャンセルボタン押下時のイベント定義です。-->
        <w:event command="afterCancelUpdate">
            <w:fireEvent command="afterCancelUser"/>
        </w:event>
        <!-- ↓キャンセルボタン押下時のイベント定義です。 -->
        <w:event command="afterCancelDelete">
            <w:fireEvent command="afterCancelUser"/>
        </w:event>
		
    </w:form>

    <w:list name="userList">
        <w:dataSource dao="userMap"/>
        <w:field header="ユーザID" name="user_id"/>
        <w:field header="名前" name="user_name"/>
        <w:field header="メールアドレス" name="mail"/>
    </w:list>

</w:application>
    リスト 2-7　app.xmlファイル(81行目あたりから)

2.5.2. ユーザ一覧表示画面のイベントハンドラの定義
  1. Eclipseでfalcon_web_tutorial/WEB-INF/falcon/app.xmlファイル(以下app.xmlファイル 81行目あたりから)を開き、リスト 2-8のように修正を行います。 
    
    <w:menu name="menu" template="titlemenu">
    </w:menu>

    <w:panel name="mainPanel">
        <w:unit name="userList" initial="userList"/>
        
        <!-- ↓ユーザ一覧画面の[追加]ボタン押下時のイベント定義です。-->
        <w:event command="insertUser">
            <w:changeWidget name="userForm" widget="userForm"
		    mode="insert"/>
        </w:event>
        <!-- ↓ユーザ一覧画面の[更新]ボタン押下時のイベント定義です。-->
        <w:event command="updateUser" parameter="/data">
            <w:changeWidget name="userForm" widget="userForm"
		    mode="update"
            key="{ID=/data/id}"/>
        </w:event>
        <!--↓ユーザ一覧画面の[削除]ボタン押下時のイベント定義です。-->
        <w:event command="deleteUser" parameter="/data">
            <w:changeWidget name="userForm" widget="userForm"
		    mode="delete"
            key="{ID=/data/id}"/>
        </w:event>
        <w:event command="afterEditUser">
            <w:updateWidget name="userList"/>
            <w:deleteWidget name="userForm"/>
        </w:event>
        <w:event command="afterCancelUser">
            <w:deleteWidget name="userForm"/>
        </w:event>
		
    </w:panel>

    <w:form name="userForm">
        <w:dataSource dao="userMap"/>
        <w:field header="ユーザID" name="user_id"
            type="text" maxlength="128" size="40"/>
        <w:field header="パスワード" name="password"
            type="password" maxlength="128" size="40"/>
        <w:field header="名前" name="user_name"
            type="text" maxlength="128" size="40"/>
        <w:field header="メールアドレス" name="mail"
            type="text" maxlength="128" size="40"/>
        <w:field header="郵便番号" name="zip"
            type="text" maxlength="7" size="10"/>
        <w:field header="住所" name="address"
            type="textarea" col="40" row="5"/>
        <w:field header="電話番号" name="tel"
            type="text" maxlength="11" size="10"/>
        <w:field header="誕生日" name="birthday"
            type="text" maxlength="8" size="10"/>
        <w:commandBox name="edit">
            <w:insert type="button" text="追加"/>
            <w:update type="button" text="更新"/>
            <w:delete type="button" text="削除"/>
            <w:ok type="button" text="OK"/>
            <w:cancel type="button" text="キャンセル"/>
        </w:commandBox>
        <w:event command="afterInsert">
            <w:fireEvent command="afterEditUser"/>
        </w:event>
        <w:event command="afterUpdate">
            <w:fireEvent command="afterEditUser"/>
        </w:event>
        <w:event command="afterDelete">
            <w:fireEvent command="afterEditUser"/>
        </w:event>
        <w:event command="afterCancelInsert">
            <w:fireEvent command="afterCancelUser"/>
        </w:event>
        <w:event command="afterCancelUpdate">
            <w:fireEvent command="afterCancelUser"/>
        </w:event>
        <w:event command="afterCancelDelete">
            <w:fireEvent command="afterCancelUser"/>
        </w:event>
    </w:form>

    <w:list name="userList">
        <w:dataSource dao="userMap"/>
        <w:field header="ユーザID" name="user_id"/>
        <w:field header="名前" name="user_name"/>
        <w:field header="メールアドレス" name="mail"/>
		
        <w:fieldCommandBox name="edit">
            <w:command name="update" command="updateUser" type="button"
		    text="更新"/>
            <w:command name="delete" command="deleteUser" type="button"
		    text="削除"/>
        </w:fieldCommandBox>
        <!--↑リスト表示されたデータ1行ずつに[更新]、[削除]ボタンを
		  表示する為の定義です。-->
        <w:command name="insert" command="insertUser" type="button"
		    text="追加"/>
        <!-- ↑新規にユーザを追加する[追加]ボタンを、
		  リスト表示されたデータの下部に表示する為の定義です。-->
	  
    </w:list>

</w:application>
    リスト 2-8　app.xmlファイル(81行目あたりから)

  2. ブラウザで以下のURLにアクセスし、app.xmlファイルの修正内容を反映します。
    http://localhost:8080/tutorial/?control=init

  3. ブラウザで以下のURLにアクセスし、ユーザ管理Webアプリケーションが動作することを確認します。
    http://localhost:8080/tutorial/

    図 2-11
    図 2-11