Let say you have a list of items and you want to display them in a table-like format. What you would do is to loop over those items and render each item in a column. And again you have a requirements that:

there must only have two columns and the left column' color is different from the right; and

alternating rows must also have different color. 

 

Here is a sample code to accomplish that.

 

 <xsl:template match="*" mode="main">

        <xsl:variable name="dataItem" select='your list of items, let say 8'/>

        <table border='1' width='250px' cellspacing="5px"  >
            <xsl:apply-templates  mode='table' select='$dataItem/item[position() mod 2 = 1]'  />
        </table>

    </xsl:template>

    <xsl:template mode="table" match="item" >
        <xsl:variable name="itemSet" select=". | following-sibling::item[position() &lt; 2]"/>
        <xsl:apply-templates select="$itemSet[position() mod 2 = 1]" mode="row">
            <xsl:with-param name="row" select="position()"/>
        </xsl:apply-templates>
    </xsl:template>

    <xsl:template match="item" mode="row">
        <xsl:param name="row"/>
        <xsl:variable name="rowColor">
            <xsl:choose>
                <xsl:when test="($row mod 2)=0">
                    <xsl:value-of select="'background-color:maroon;'"/>
                </xsl:when>
                <xsl:otherwise>
                    <xsl:value-of select="'background-color:black;'"/>
                </xsl:otherwise>
            </xsl:choose>
        </xsl:variable>

        <tr style="{$rowColor}" height="50px">
            <xsl:apply-templates mode="col" select=". |following-sibling::item[position() &lt; 2]">
                <xsl:with-param name="row" select="$row"/>
            </xsl:apply-templates>
        </tr>
    </xsl:template>

    <xsl:template match="item" mode="col">
        <xsl:param name="row"/>
        <xsl:variable name="color">
            <xsl:choose>
                <xsl:when test="(position() mod 2)=0">
                    <xsl:value-of select="'background-color:yellow;'"/>
                </xsl:when>
                <xsl:otherwise>
                    <xsl:value-of select="'background-color:green;'"/>
                </xsl:otherwise>
            </xsl:choose>
        </xsl:variable>

        <td width="50%">
            <div  style="{$color}">
                row: <xsl:value-of select="$row" />
                <br/>
                col: <xsl:value-of select="position()"/>
            </div>
        </td>
    </xsl:template>

The code above will render the image below:

I just noticed today that XSL Extension seems accepting a maximum of three (3) parameters. My XSL runs smoothly until I make a method that has 4 parameters. I don't know if this is really the real behaviour. I haven't consulted google yet.

We all know that to consume an XSL variable with other XSL tag we just prefix it with dollar ($). But how about passing the variable to HTML tags? The answer: just enclosed it with curly braces ( {} ).

 

 <xsl:variable name="someVar" select="'some value'"/>

 

<xsl:value-of select="$someVar" /> 

 

<div id="{$someVar}"> 

some others...  

</div>