- PR -

XSLTで思い通りの表が作れない

1|2 次のページへ»
投稿者投稿内容
ぴょん
会議室デビュー日: 2003/08/10
投稿数: 3
投稿日時: 2003-08-10 20:37
///xml///

<root>
<item no="0001">
<jpeg>012345.jpg</jpeg>
<a>A5022</a>
<b>4D2C</b>
<comments>apple</comments>
</item>
<item no="0002">
<jpeg>022359.jpg</jpeg>
<a>E2792</a>
<b>1A6A</b>
<comments>book</comments>
</item>

</root>

///////
上記のようなXML文書があり中身にはitemは1000以上あります。
これを
・画像の下に要素(a or b)が表示され、それらが横方向に順に並び、10個毎に改行
　(横10縦nの表にしたいと考えています)
・上記のことを要素<a>でsortした場合、要素<b>でsortした場合でそれぞれ表示したい

これらの要求を満たす表をxsltで書けずに困っています。
良い方法をご教授いただけると大変助かります。

[ メッセージ編集済み 編集者: ぴょん 編集日時 2003-08-11 01:04 ]
ocean
ベテラン
会議室デビュー日: 2003/07/06
投稿数: 65
投稿日時: 2003-08-11 00:38
切り替えの部分ですが、とりあえず <xsl:variable> でお茶を濁しました。
<tr>をエスケープして整形式を乱さないようにする方法は、このサイトを参考にしました。
動作確認は、MSXML4です。

コード:

<?xml version="1.0" encoding="Shift_JIS"?>



<xsl:stylesheet version="1.0"

  xmlns:xsl="http://www.w3.org/1999/XSL/Transform">



  <xsl:output method="xml"/> <!-- for multi-byte file path -->



  <xsl:variable name="key" select="'a'"/>

  <xsl:variable name="row" select="3"/>



  <xsl:template match="/root">

    <html>

      <head>

        <title>画像一覧</title>

        <style type="text/css"><![CDATA[

          tr { text-align: center; }

        ]]></style>

      </head>

      <body>

        <table border="1">

          <xsl:apply-templates select="item">

            <xsl:sort select="child::node()[local-name() = $key]"/>

          </xsl:apply-templates>

        </table>

      </body>

    </html>

  </xsl:template>



  <xsl:template match="item">

    <xsl:if test="position() mod $row = 1">

      <xsl:text disable-output-escaping="yes">&lt;</xsl:text>

      <xsl:text>tr</xsl:text>

      <xsl:text disable-output-escaping="yes">&gt;</xsl:text>

    </xsl:if>

    <td>

      <img src="{jpeg}" width="100" height="100"/>

      <br/>

      <xsl:value-of select="child::node()[local-name() = $key]"/>

    </td>

    <xsl:if test="(position() mod $row = 0) or (position() = last())">

      <xsl:text disable-output-escaping="yes">&lt;</xsl:text>

      <xsl:text>/tr</xsl:text>

      <xsl:text disable-output-escaping="yes">&gt;</xsl:text>

    </xsl:if>

  </xsl:template>



</xsl:stylesheet>


[ メッセージ編集済み 編集者: ocean 編集日時 2003-08-11 00:44 ]

[ メッセージ編集済み 編集者: ocean 編集日時 2003-08-11 10:07 ]
ocean
ベテラン
会議室デビュー日: 2003/07/06
投稿数: 65
投稿日時: 2003-08-11 00:51
私も最近見つけたのですが、XSLTにはこのページがわかりやすそうです。参考まで。
ほむら
ぬし
会議室デビュー日: 2003/02/28
投稿数: 583
お住まい・勤務地: 東京都
投稿日時: 2003-08-11 10:09
ども、ほむらです。
微々たる物なのですが気になったので一言
--------------------
ocean氏のコードで
引用:

<td>
<img src="{jpeg}" width="100" height="100"/>
<br/>
<xsl:value-of select="child::node()[local-name() = $key]"/>
</td>
<xsl:if test="(position() mod $row = 0) or (position() = last())">

の部分は工夫してあげないとitemの個数が10の倍数でない場合
ネットスケープなどの厳密なブラウザでは正常に表示できない可能性もあるので
あしからず。。。

# 最後の一枚を表示したあと 10の剰余の数だけブランクセルを作る
# 関数を呼べばよいだけです。(再帰呼び出し)
ocean
ベテラン
会議室デビュー日: 2003/07/06
投稿数: 65
投稿日時: 2003-08-11 11:24
こんにちは、ほむらさん。

W3CのHTML4.01で調べたところ、

For any row that has fewer than this number of columns, the end of that row should be padded with empty cells.

とあったので、大丈夫みたいです。


[ メッセージ編集済み 編集者: ocean 編集日時 2003-08-11 11:50 ]
ぴょん
会議室デビュー日: 2003/08/10
投稿数: 3
投稿日時: 2003-08-11 12:01
oceanさん、ほむらさん

お返事ありがとうございます。お陰様で求めていた形の表になりました。
しかしまた問題が発生しました。印刷を考えるとレイアウトがうまくまとまらずに
困っています。横10×縦20くらいに分割してそれぞれを表示することは可能でしょうか？
たびたび申し訳ありませんが宜しくお願いします。
ocean
ベテラン
会議室デビュー日: 2003/07/06
投稿数: 65
投稿日時: 2003-08-11 12:26
<xsl:template match="item"> の中の <xsl:if> の条件式を書き換えればできると思います。

#追加

あと、<td> を出力する部分にも <xsl:if> が必要です。


[ メッセージ編集済み 編集者: ocean 編集日時 2003-08-11 12:28 ]
ほむら
ぬし
会議室デビュー日: 2003/02/28
投稿数: 583
お住まい・勤務地: 東京都
投稿日時: 2003-08-11 14:46
ども、ほむらです。
先ほどから文句ばかりで心苦しいのですが。。。。
-----------
ocean氏へ
引用された部分だけでは、空のセルで埋めるべきと書いてあるように思ったので
該当の英文読んで見ました。
僕の訳が間違えてなければ、
ユーザーエージェント側で計算して
足りないセルについては空のセルを補充すべきというわけですね。

だから結果として、ocean氏的にはHTMLとしては足りなくても問題ないと。。。

ぴょん氏へ
引用:

しかしまた問題が発生しました。印刷を考えるとレイアウトがうまくまとまらずに
困っています。横10×縦20くらいに分割してそれぞれを表示することは可能でしょうか？
たびたび申し訳ありませんが宜しくお願いします。

えと、印刷表示で分割ということは
最大 横10×縦20 のテーブルを複数作りたいということなのでしょうか？
この形で作ろうと思うのならばocean氏のコードは
ほとんど書き換える形になってしまうと思います。

あと、印刷って結局はクライアント依存なんですよね。
PostScriptやJavaScriptを併用しない場合、
せっかくそろえたレイアウトも台無しになってしまう可能性が高いです。
印刷の場合は特にです
1|2 次のページへ»

スキルアップ／キャリアアップ（JOB@IT）