If you see this, you must use any unsupported web browser. Or constructing the page.
この表示が見えている場合、描画処理中です。しばらくお待ちください。 長時間見えている場合は、非対応ブラウザで参照しています。

INTER-Mediator Lab. - Room 1

5. 繰り返しの実装

エンクロージャー、リピーターの概念

あるレコードのあるフィールドと、タグ要素に組み込まれるデータが連動できることはすでに説明しました。一方、データベースの出力が複数のレコードを持つのが一般的です。複数のレコードがある場合に、HTMLの要素とどのように合成するかという点をここでまとめておきます。

まず、1つの例を示します。あるデータベースaddressで、pnameフィールドに名前、telフィールドに電話番号が入力されているとします。このデータベースからデータを取り出すために、次のようなコンテキストが定義されているとします。

name: address
key: id

通常、レコードが100個あれば、100個分のレコードがデータベースから取り出されます。このとき、ページファイルに次のようなHTMLでの記述があるとします。

<table>
    <thead>
        <tr><th>名前</th><th>電話番号</th></tr>
    </thead>
    <tbody>
        <tr>
            <td class="IM[address@pname]"></td>
            <td class="IM[address@tel]"></td>
        </tr>
    </tbody>
</table>

INTER-Mediatorは、ターゲット指定のある要素から「address」というnameの値を持つコンテキスト、すなわちaddressテーブルからデータを取り出しますが、その結果は複数のレコードとなるわけです。

INTER-Mediatorは上記のようなHTMLがある場合、TRタグ要素を一度TBODYタグ要素から取り出します。そして、取り出したレコードセットを順番にチェックして、正しいレコードがあれば、TRタグ要素を複製してその中のリンクノードに現在のレコードのフィールドに対する値を組み込み、TBODYの子要素として追加します。つまり、レコードの数だけTRタグを複製して、それぞれのTRタグに順番にレコードの中身を埋め込みます。こうして、「ここからここまでを繰り返す」というような指定をしなくても、上記のTABLE要素の場合、レコード数分の行数のテーブルが作られます。

上記のTBODYのような繰り返しの親要素にあたる要素を「エンクロージャー」、そしてレコードの数だけ繰り返す要素を「リピーター」と呼びます。リピーターは単一のタグ要素かもしれませんが、その中に含まれるすべての要素を含むので、多数の要素ということになります。

エンクロージャーとリピーターとして利用できる要素として、次の表のようなものがあります。

用途エンクロージャーリピーター
TBODYTR(複数のTRも可能)
ポップアップSELECTOPITON
リスティングUL, OLLI
汎用class属性が_im_enclosureのDIVclass属性が_im_repeaterのDIV
汎用class属性が_im_enclosureのSPANclass属性が_im_repeaterのSPAN

INTER-Mediatorはページファイルを解析して、ターゲットノードが見つかると、そこから上位の要素をたどり、リピーターを見つけてさらにそのエンクロージャーを特定します。そして、再度、リピーター内部についてすべてのターゲットノードを探すということを行います。

なお、1つのエンクロージャーにより展開においては、1つのコンテキストを利用してデータベースからデータを取り出すため、ターゲットノードでは単一の名前が指定されていることが必要です。前の例だと、2つのTDタグ要素のターゲット指定の最初のキーワードはaddressで同一でしたが、この状態が必要です。

TABLEタグによる表以外では、DIVやSPANでエンクロージャーとリピーターのセットを構築できるので、繰り返しの形式は表にはこだわりません。しかしながら、TABLEを使う事が多いでしょう。TBODY要素は記述しない場合、通常はブラウザが存在するものとして扱うので明示されていない場合もあります。ただし、見出しとデータを分離するには、THEADとTBODYで分離する記述を行う必要があります。

学習時間調査

ログインユーザ:|

読み終わったとき、以下のラジオボタンのいずれかを選択して、「読み終わった」ボタンをクリックしてください。

開いてから今まで、このページを、

ほとんどの時間は読む事に使わなかった
あまり時間をかけて読んではいなかった
他のことと半々くらいの時間をかけて読んだ
多くの時間をかけて読んだ
ほとんどの時間を読む事に使った

このページの内容について、自分が感じる理解度は、

ほとんど分からなかった
少しは分かったが半分以下しか分からなかった
半々くらい
すべては理解できないが半分以上は理解した
ほとんど理解できた

←クリックすると、次のページに移動します。

実験のトップページ(Room 1)へ