チュートリアル - 色々なところにデータを表示してみる

データの表示先は,定義ファイル target タグの id 属性で指定します。
ここでは,id属性指定により,同一のデータを複数の場所に表示させることをやってみます。

「test」ボタンを押すと

ステップ1 : HTMLの作成

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

<html>

 <head>
  <script type="text/javascript" src="/conga/dhtml/conga.js" charset="UTF-8"></script>
  <link rel="stylesheet" href="/conga/dhtml/conga.css" type="text/css">
  <style type="text/css">
   .i {width:100px; border:blue 1px solid; margin-top:0px}
  </style>
 </head>

 <body>

<form>
 入力領域:<input type="text" name="text">
 <input type="button" name="test" onclick="new CongaRequest().send('test.r')">
</form>

INPUTタグ (id="input-tag"): <br>
<input id="input-tag" type="text" ></input><br><br>

Pタグ (id="p-tag"):
<p   id="p-tag"     class="i" style="height:20px;"></p><br>

DIVタグ (id="div-tag"):
<div id="div-tag"   class="i" style="height:200px;"></div>

</body>
</html>

記述に関するポイントは以下の4点です。

ステップ2 : Value オブジェクト(Page オブジェクト)クラスの作成

Value オブジェクトは,「チュートリアル - 入力した値を表示させてみる」で作成した TestData クラスを使用します。

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

リクエスト定義ファイルは以下のようになります。


<module>
  <request id="test.r" page="test.nga.servlet.TestData">

    <parameter>
      <property name="text" required="true" />
    </parameter>

    <result>
      <target name="text" id="input-tag" />
      <target name="text" id="p-tag" />
      <target name="text" id="div-tag" include="./jsp/test.jsp" />
      <target type="iwindow" name="text" id="window"
        title="ウインドウへも"
        bounds="20,20,200,100"
        icon="url(/conga/dhtml/img/mail.png)"
      />
    </result>

  </request>
</module>

リクエスト定義ファイルの記述ポイントは「<target> タグの id 属性を HTML で記述した id 属性と同じにする」ということだけです。

なお,今回は,内部ウインドウ表示を行なっていますが,この場合は,target タグの type 属性に "iwindow" を指定してください。

ステップ4 : JSPの作成

 リクエスト定義ファイルの target タグに include 属性を指定することにより,JSP や HTML の内容を表示データとすることができます。
 この例では div-tag に表示する内容を include="./jsp/test.jsp" で指定しています。

<%@ page contentType="text/html; charset=Shift_JIS" %>
<%@page import="nga.servlet.dsp.writer.DefaultResultWriter"%>

<%Object value = DefaultResultWriter.getTargetValue(request).getValue();%>
<h1><%=value%></h1>
<h2><%=value%></h2>
<h3><%=value%></h3>

DefaultResultWriter クラスの getTargetValue(request) メソッドを呼び出すことにより,現在処理対象となっているデータに関する情報 (TargetValue) を取得できます。
TargetValue の getValue() メソッドを呼び出すことにより,現在出力対象となっている値を取得することができます。


TOP