とっぷぺーじ

概要

標準パターンの中でも最も標準的な標準的なType1:一覧登録の標準(タグ)について、ソースコードレベルでの解説を行います。

IMG51.JPG

JSPのソースコードの構成

opengion/uap/webapps/gf/jsp/GF9110/がこの画面のソースになります。

opengionでは、画面のIDに関連付けて、画面のJSPのソースコードが管理されています。 画面IDは、各画面の右上の表示から確認することができます。 また、この関連付けは、画面リソースで定義されます。

さらに、1つの画面のJSPのソースコードは、画面フォルダ内に格納されており、フォルダ単位で画面ソースの管理を行うことができるようになっています。

IMG50.JPG

では実際に、標準画面のソースフォルダを確認してみましょう。

このフォルダには、以下のようなJSPが存在しています。

query.jsp
result.jsp
update.jsp
entry.jsp
index.jsp
forward.jsp

この内、query.jsp,result.jsp,update.jsp,entry.jspについては、下の画面イメージのように それぞれの場合において呼び出されます。

IMG03.JPG

これ以外のindex.jspについては、フレーム分割を行っており、またforward.jspについては、result.jsp→update.jspといった画面遷移の制御を行っています。

各ソースの説明

query.jsp

検索条件の入力画面です。ここで重要なのは、og:columnタグです。

  • og:columnタグ
    各々の検索条件の項目は、og:columnタグで生成されます。例えば、
    <og:column name="SYSTEM_ID" />
    と記述すると、
    IMG05.JPG
    のように表示されます。この、SYSTEM_IDという項目名とシステムIDという名称を関連付けているのが、ラベルリソースになります。
    また、桁数や、文字の種別(半角英数のみ? or 全角入力可? 等)等、項目の属性を定義しているのが、カラムリソースになります。

    【カラムリソースの設定】
    IMG31.JPG
    ※カラムリソース登録画面に日本語名称が表示されていますが、これの実態は、ラベルリソースです。
    【ラベルリソースの設定】
    IMG32.JPG


    次に、他の項目としてプルダウンで表示されている言語に着目します。

    IMG08.JPG
    JSPのソースコード上は、先程のシステムIDと同じように
    <og:column name="LANG" />
    と記述しているだけになります。 この入力方法(テキスト入力ではなく、プルダウン選択)を定義しているのも、カラムリソースになります。 また、このプルダウンの内容の定義は、コードリソースで行っています。

    【カラムリソースの設定】
    IMG33.JPG
    【コードリソースの設定】
    IMG34.JPG
  • og:queryButtonタグ
    最後に、検索条件の入力項目をsubmitするためのボタンは、
    <og:queryButton />
    で生成しています。

result.jsp

query.jspで入力された検索条件に従いクエリを発行し、結果を画面に表示します。
ここで、重要なタグはog:query(クエリの発行)及びog:view(結果の表示)、そしてog:sumbit(編集ボタンの表示)です。

  • og:queryタグ
    まずは、og:queryタグから見てみましょう。
    <og:query command="{@command}" debug="{@debug}"
     maxRowCount="{@maxRowCount}">
     <jsp:text>
      select CASE KBSAKU WHEN '3' THEN '1' ELSE KBSAKU END AS WRITABLE,
        CLM,NAME_JA,LABEL_NAME,KBSAKU,SYSTEM_ID,LANG,FGJ
      from GF41
     </jsp:text>
     <og:where>
      <og:and value = "FGJ         in  ('0','1')"         />
      <og:and value = "SYSTEM_ID   =  '{@SYSTEM_ID}'"     />
      <og:and value = "LANG        =  '{@LANG}'"          />
      <og:and value = "CLM         like '{@CLM}%'"        />
      <og:and value = "NAME_JA     like '{@NAME_JA}%'"    />
      <og:and value = "LABEL_NAME  like '{@LABEL_NAME}%'" />
      <og:and value = "KBSAKU      =    '{@KBSAKU}'"      />
     </og:where>
     <og:appear startKey = "order by" value = "{@ORDER_BY}"
        defaultVal = "SYSTEM_ID,CLM,LANG" />
    </og:query>
    クエリの発行は、SQL文を直接記述します。(実は、これがopenGionの重要な基本思想です)
    但し、where句は、og:whereタグとog:andタグを利用して定義します。
    • og:whereタグ,og:andタグ
      まずは、パラメータの取得方法から説明します。query.jspだけでなく、各入力項目のパラメーターは、
      {@xxxx} # xxxxは項目名
      で取得することができます。例えば、query.jspの
      <og:column name="SYSTEM_ID" />
      で生成された入力項目の値は、result.jspでは、
      {@SYSTEM_ID}
      で取得することができます。 これを踏まえると、上記の
      <og:and value = "SYSTEM_ID   =  '{@SYSTEM_ID}'"     />
      は、query.jspの入力値を元に、SYSTEM_IDの検索条件が生成されることが予想できます。
      但し、普通に
      and SYSTEM_ID = '{@SYSTEM_ID}'
      と記述した場合、システムIDの検索条件に何も入力されなかった場合は、
      and SYSTEM_ID = ''
      となってしまい、データが検索されなくなります。
      このため、og:andタグでは、value属性に記述されたリクエストパラメーターがnull出ない場合のみ、条件句を生成するようになっており、nullの場合は、条件句そのものが消去されます。
      なので、query.jspのパラメーターに対してwhere句を定義する場合は、(それが必須パラメーターでない限り)、og:where,og:andタグを用いて記述します。
  • og:viewタグ
    og:queryタグで検索した内容を表示します。
    検索したデータは、select文で記述した項目名をキーとしたリソース定義を元に基づき表示されます。
    具体的には、項目のヘッダー部分には、その項目のラベルリソースの名称が、また各データは、カラムリソースの表示種別の定義に基づいて変換され表示されます。
    IMG35.JPG
    また、内部的には、og:queryとog:viewの間には、内部的にDBTableModelが生成されています。これもopenGionの重要な概念の1つですが、詳細については、リンク先のぺーじを参照して下さい。
    さて、話を戻して、og:viewタグの記述は、以下のようになります。
    <og:view
     viewFormType = "HTMLTable"
     command    = "{@command}"
     noDisplay  = "FGJ"
     checked    = "{@checked}"
     startNo    = "{@startNo}"
     pageSize   = "{@pageSize}"
    />
    このタグを記述することで、
    IMG06.JPG
    の部分が表示されます。
    この例では、検索結果をそのままレイアウトを定義することなく表示していますが、viewFormType?の属性で、表示のタイプを指定することで、個別にレイアウトを変更するなどして表示方法を変更することができます。
  • og:sumbitタグ
    <og:submit value="update" command="COPY" lbl="COPY" accesskey="C"
     keys="noWritable" vals="null" />
    の記述により
    IMG09.JPG
    編集ボタンの表示を行います。
    遷移先の画面については、value属性で定義されます。この場合、update.jspに遷移します。
    ここでは、複写、変更、削除の全てにおいて、遷移先は、update.jspとなっています。
    但し、実際には、ボタンによって遷移先の画面の挙動(入力可能項目など)がことなります。
    この挙動の違いを制御するのが、command属性になります。
    例えば、COPYボタンの場合は、
    command="COPY"
    と指定されています。
    このcommand属性の影響については、次のupdate.jspで説明します。

update.jsp

result.jspから遷移し、データの編集を行います。
ここで重要なタグは、og:entryです。

  • og:entry
    og:entryタグの記述は少し長いですが、次のようになっています。
    <og:entry command = "{@command}" >
     <og:columnSet command="COPY" columnId="CLM"
      action="NULLSET" value="{@MEM.CLM}"/>
     <og:columnSet command="COPY" columnId="LABEL_NAME" action="TBLSET"
      value="[NAME_JA]" conditionKey="LABEL_NAME" conditionList="" />
     <og:columnSet command="MODIFY" columnId="LABEL_NAME" action="TBLSET"
      value="[NAME_JA]" conditionKey="LABEL_NAME" conditionList="" />
    </og:entry>
    まずは、og:entryタグです。
    このタグでは、result.jspの各編集ボタンで定義されたcommand属性の値により、内部的に生成されたDBTableModelに対して、以下のように行操作を行っています。
    command = "INSERT" > 選択行の直下に、編集可能な行を追加
    command = "COPY"   > 選択行の直下に、元の行の値をコピーし、編集可能な行を追加
    command = "MODIFY" > 選択行を編集可能な状態に変更
    command = "DELETE" > 選択行を編集可能な状態に変更
    さらに、og:columnSetでは、選択された各行に対して、固定値などのセットを行っています。
    このように、og:queryタグで生成されたDBTableModel?に対して、og:entryタグで操作を行っています。
    そして、最後にresult.jspと同様、操作した結果をog:viewタグで画面に表示します。
    <og:view
     viewFormType	= "HTMLTable"
     command	= "{@command}"
     noDisplay	= "FGJ"
     noWritable	= "{@noWritable}"
     columnWritable= "{@columnWritable}"
     checked	= "{@checked}"
     startNo	= "{@startNo}"
     pageSize	= "{@pageSize}" />
    ここでは、noWritable属性又は、columnWritable属性を指定することで、編集可能な行に対して、 入力不可能なカラム又は入力可能なカラムを指定しています。
    このサンプルでは、この指定自体をresult.jspのog:submitのパラメーターとして定義しています。

entry.jsp

update.jspで記述した値をデータチェックした後をDBTableModel?に書き込み、最後にデータの更新を行います。
ここで重要なのは、og:columnCheck(データチェック)、og:entry(DBTableModel?への書き込み)、そしてog:tableUpdate(DBへのデータ登録)です。

  • og:columnCheck
    <og:columnCheck command="{@command}" />
    の記述により、パラメーターのデータチェックを行います。
    データのチェックは、カラムリソースの文字種別の定義に従ってチェックが行われます。
  • og:entry
    <og:entry command="{@command}"  />
    の記述により、パラメーターの値をDBTableModelに登録します。
  • og:tableUpdate
    <og:tableUpdate command="{@command}" queryType="JDBCTableUpdate"
     debug="false">
     <og:tableUpdateParam
      sqlType  = "{@sqlType}"
      table  = "GF41"
      where  = "SYSTEM_ID=[SYSTEM_ID] AND LANG=[LANG] AND CLM=[CLM]
                AND FGJ IN ('0','1')"
     />
    </og:tableUpdate>
    og:tableUpdateParam?タグと組み合わせることにより、sqlType(COPY or MODIFY or DELETE)に応じて、SQL文(INSERT or UPDATE or DELETE)を自動生成します。
    og:tableUpdateParam?のtable属性では対象となるテーブルを、where属性では、UPDATE,DELETEを行う際のwhere句を指定しています。
    [XXXX]は、DBTableModelの項目名を意味しています。

この画面では、登録処理が簡単であるため、タグにて処理を行っています。
実際の画面開発において、業務ロジックを記述する場合は、JavaクラスまたはPL/SQLにより実装を行い、カスタムタグからこれらを呼び出すことで処理を行います。
記述方法については、それぞれの標準パターンである、標準解説(標準(PL/SQL))、または、標準(PL/SQL),標準(Java)を参照して下さい。


index.jsp

検索条件の入力するフレームと、結果を表示し編集するフレームの、フレーム分割の定義を行っています。

forward.jsp

result.jspからupdate.jsp、update.jspからentry.jspと言った画面遷移の制御を行っています。
この制御自体は、forward.jsp内の

<og:commonForward dbkeys="{@dbkeys}" />

で行われています。


添付ファイル: fileIMG51.JPG 220件 [詳細] fileIMG50.JPG 217件 [詳細] fileIMG35.JPG 225件 [詳細] fileIMG34.JPG 216件 [詳細] fileIMG33.JPG 210件 [詳細] fileIMG32.JPG 216件 [詳細] fileIMG31.JPG 226件 [詳細] fileIMG06.JPG 223件 [詳細] fileIMG09.JPG 229件 [詳細] fileIMG08.JPG 225件 [詳細] fileIMG05.JPG 236件 [詳細] fileIMG03.JPG 246件 [詳細]

トップ   編集 凍結 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS
Last-modified: 2010-02-25 (木) 13:19:06 (712d)