Question

I’ve seen examples of transforming “adjacency model” XML but none that will do it quite right for a ul/li bullet list. Could someone give me a hint? It would be great if the solution could support typical adjacency model requirements and deal with multiple level nesting/recursion.

If the XML is:

<?xml version="1.0" encoding="ISO-8859-1"?>
<root>
  <row Id="2" Name="data" />
  <row Id="3" Name="people" />
  <row Id="4" Name="person" ParentId="3" />
  <row Id="6" Name="folder" ParentId="2" />
  <row Id="7" Name="thing" ParentId="3" />
  <row Id="8" Name="web" />
  <row Id="9" Name="link" ParentId="8" />
</root>

And I use something like:

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

<xsl:template match="/">
<ul id="someid" class="menu">
  <xsl:apply-templates select="root/row[not(@ParentId)]"/>
</ul>
</xsl:template>

<xsl:template match="row">
<ul>
    <li>
    <xsl:variable name="ID" select="@Id"/>
      <xsl:attribute name="rel">
      <xsl:value-of select="@Id"/>
      </xsl:attribute>
      <xsl:value-of select="@Name"/>
      <xsl:apply-templates select="//row[@ParentId=$ID]"/>
   </li>
</ul>
</xsl:template>

</xsl:stylesheet>   

Then I get:

<ul id="someid" class="menu">
  <ul>
    <li rel="2">
      data<ul>
        <li rel="6">folder</li>
      </ul>
    </li>
  </ul>
  <ul>
    <li rel="3">
      people
      <ul>
        <li rel="4">person</li>
      </ul><ul>
        <li rel="7">thing</li>
      </ul>
    </li>
  </ul>
  <ul>
    <li rel="8">
      web<ul>
        <li rel="9">link</li>
      </ul>
    </li>
  </ul>
</ul>

Note the extra close/open ul tags between the “person” and “thing” li’s- shouldn’t be there. I can see why it’s happening but just not sure how to change the code to fix it.

Thanks.

Answer 1

Updated to reflect OP new requests

This is a recursive template which does an HTML-compliant nested list as deinfed in the W3C specs.

<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">

    <xsl:output indent="yes"/>

    <xsl:template match="/root">
        <ul id="someid" class="menu">
            <xsl:apply-templates select="row[not(@ParentId)]"/>
        </ul>
    </xsl:template>

    <xsl:template match="row">
        <li rel="{@Id}">
            <xsl:value-of select="@Name"/>
            <xsl:if test="count(../row[@ParentId=current()/@Id])>0">
                <ul>
                    <xsl:apply-templates select="../row[@ParentId=current()/@Id]"/>
                </ul>
            </xsl:if>
        </li>
    </xsl:template>

</xsl:stylesheet>

Applied on this input:

<root>
  <row Id="1" Name="data" />
  <row Id="2" Name="data" />
  <row Id="3" Name="people" />
  <row Id="4" Name="person" ParentId="3" />
  <row Id="6" Name="folder" ParentId="2" />
  <row Id="7" Name="thing" ParentId="3" />
  <row Id="8" Name="web" />
  <row Id="9" Name="link" ParentId="8" />
    <row Id="10" Name="anotherone" ParentId="9" />
    <row Id="11" Name="anotherone" ParentId="9" />
    <row Id="12" Name="anotherone" ParentId="9" />
    <row Id="13" Name="anotherone" ParentId="3" />
</root>

Produces:

<ul id="someid" class="menu">
   <li rel="1">data</li>
   <li rel="2">data<ul>
         <li rel="6">folder</li>
      </ul>
   </li>
   <li rel="3">people<ul>
         <li rel="4">person</li>
         <li rel="7">thing</li>
         <li rel="13">anotherone</li>
      </ul>
   </li>
   <li rel="8">web<ul>
         <li rel="9">link<ul>
               <li rel="10">anotherone</li>
               <li rel="11">anotherone</li>
               <li rel="12">anotherone</li>
            </ul>
         </li>
      </ul>
   </li>
</ul>

If you are in trouble about how list should be created, try them at W3School.