使用xsl填充html表中的空行

时间:2012-05-17 18:50:17

标签: html css xml xslt html-table

我想创建多个html表页面,使用XML作为输入,xsl作为转换语言。 现在这些表应该始终具有固定的高度,无论它只是一行还是十行。 我无法使用CSS(min-height)。 所以我想知道,如果有可能让xsl总是输出十行并添加空行,以防少于十行或添加行,以防XML中存在多于十行并因此调整表的大小。

有关如何实现这一目标的任何想法?

1 个答案:

答案 0 :(得分:1)

你确定可以做到。我可以告诉你如何将你的数据分成几个表,每个表都有10行,当你没有足够的时候,它们会填充最后一行(或者可能只有一行)。它应该可以帮助您到达需要的位置(没有示例XML输入和所需的HTML输出,这是我能做的事情)

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" 
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

    <xsl:output method="html" encoding="UTF-8"/>

    <xsl:template match="/">
        <xsl:apply-templates select="data/row[position() mod 10 = 1]" mode="newtable"/>
    </xsl:template>

    <xsl:template match="row" mode="newtable">
        <table>
            <xsl:apply-templates select="."/>
            <xsl:apply-templates select="following-sibling::row[position() &lt; 10]"/>
            <xsl:call-template name="dummy-rows">
                <xsl:with-param 
                       name="how-many" 
                       select="9 - count(following-sibling::row[position() &lt; 10])"/>
            </xsl:call-template>
        </table>
    </xsl:template>

    <xsl:template match="row">
        <tr><td><xsl:value-of select="."/></td></tr>
    </xsl:template>

    <xsl:template name="dummy-rows">
        <xsl:param name="how-many" select="0"/>
        <xsl:if test="$how-many &gt; 0">
            <tr><td>dummy</td></tr>
            <xsl:call-template name="dummy-rows">
                <xsl:with-param name="how-many" select="$how-many - 1"/>
            </xsl:call-template>
        </xsl:if>
    </xsl:template>
</xsl:stylesheet>

我们的想法是,您使用每组10的“第一个”节点启动table。这是[position() mod 10 = 1]谓词。当您获得表的起始点时,您将创建表边界并在正常模式下再次处理该节点。然后,您将获得其后的九个数据行。最后,根据需要添加尽可能多的虚拟节点,以确保每个表中共有10个。 dummy-rows模板是递归。这里有两种技巧:按position() mod分割集合并使用recursion实现迭代。

更新如果您只需要确保表格中至少有十行,那么您就不需要拆分逻辑:

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" 
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

    <xsl:output method="html" encoding="UTF-8"/>

    <xsl:template match="/">
        <table>
            <xsl:apply-templates select="data/row"/>
            <xsl:call-template name="dummy-rows">
                <xsl:with-param 
                    name="how-many" 
                    select="10 - count(data/row)"/>
            </xsl:call-template>
        </table>
    </xsl:template>

    <xsl:template match="row">
        <tr><td><xsl:value-of select="."/></td></tr>
    </xsl:template>

    <xsl:template name="dummy-rows">
        <xsl:param name="how-many" select="0"/>
        <xsl:if test="$how-many &gt; 0">
            <tr><td>dummy</td></tr>
            <xsl:call-template name="dummy-rows">
                <xsl:with-param name="how-many" select="$how-many - 1"/>
            </xsl:call-template>
        </xsl:if>
    </xsl:template>
</xsl:stylesheet>

您可以使用以下输入尝试此操作:

<data>
  <row>1</row>
  <row>1</row>
  <row>3</row>
</data>

或像这样的输入:

<data>
    <row>1</row>
    <row>2</row>
    <row>3</row>
    <row>4</row>
    <row>5</row>
    <row>6</row>
    <row>7</row>
    <row>8</row>
    <row>9</row>
    <row>10</row>
    <row>11</row>
    <row>12</row>
</data>

在这两种情况下,结果都符合预期。试试吧。你应该可以从这里拿走它。