Help on generating HTML table please!!

minhnghia · September 2nd, 2007, 09:02 AM

Hi everyone,

I am a beginner of XSLT and have a project on generating HTML table.Basically, I want to generate the HTML based on the other table specification in XML. The work will be very much akin to dataTable tag in JavaServer Faces.
For example:
I have XML specfication:
<table>
    <column>
        <text>Username</text>
        <text>Password</text>
    </column>
    <column>
        <inputTextField name="userName"/>
        <inputPasswordField name="password"/>
    </column>
</table>

and I want to generate the table as follow:

Username "<input type="text" name="userName"/>"
Password "<input type="password" name="password"/>"

The input should be rendered as normal text box and password field in browser.
The <text>,<inputTextField> and <inputPasswordField> can be handled by some "template match" in the stylesheet. The trickiest part is how to put the <tr> and <td> in the correct way to get the expected result.

I hope you can help me.

Thank you so much.

bonekrusher · September 2nd, 2007, 10:14 AM

For Starters your Table template in XSTL should look something like this:

Code:

    <xsl:template match="table">
        <table>

                <xsl:for-each select="column">
                    <tr>
                        <xsl:for-each select="text">
                            <td>
                                <xsl:apply-templates/>
                            </td>
                        </xsl:for-each>
                    </tr>
                </xsl:for-each>

        </table>

joefawcett · September 2nd, 2007, 10:19 AM

Creating tables that have the labels in one column and the data in an adjacent one is trickier than ones with a header row. I would apply-templates to table/column[1] and within that process each text element followed by each following-sibling::column/text where the position of each text element is the same as the current text position.

--

Joe (Microsoft MVP - XML)

samjudson · September 2nd, 2007, 10:26 AM

Try something like this:

Code:

<xsl:template match="table">
    <xsl:variable name="cols" select="count(column[1]/*)" />
    <table>
        <xsl:for-each-group select="//column/*" group-adjacent="position() mod $cols">
            <tr>
            <xsl:for-each select="current-group()">
                <xsl:apply-templates select="." />
            </xsl:for-each>
            </tr>
        </xsl:for-each-group>
    </table>
</xsl:template>

/- Sam Judson : Wrox Technical Editor -/

joefawcett · September 2nd, 2007, 10:58 AM

For a version one solution something like:

Code:

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  <xsl:output method="html"/>
  <xsl:template match="/">
    <table>
      <xsl:apply-templates select="table/column[1]"/>
    </table>
  </xsl:template>

  <xsl:template match="table/column">
    <xsl:for-each select="text">
      <xsl:variable name="position" select="position()"/>
      <tr>
        <td><xsl:value-of select="."/></td>
        <td><xsl:apply-templates select="../../column[2]/*[position() = $position]"/></td>
      </tr>
    </xsl:for-each>
  </xsl:template>

  <xsl:template match="inputTextField">TEXTBOX</xsl:template>

  <xsl:template match="inputPasswordField">PASSWORDBOX</xsl:template>
</xsl:stylesheet>

--

Joe (Microsoft MVP - XML)

minhnghia · September 2nd, 2007, 12:35 PM

Thank you very much,friends!

The version by joefawcett works for me, it does generate the table with label for one column and data in adjacent column.It can be used to dynamically generate HTML form with widget specified in XML. Also thank you samjudson and bonekrusher for your solution.

It is great to participate in the forum.

Regards,