This is the mail archive of the xsl-list@mulberrytech.com mailing list .


Index Nav: [Date Index] [Subject Index] [Author Index] [Thread Index]
Message Nav: [Date Prev] [Date Next] [Thread Prev] [Thread Next]

RE: Container HTML around recursive collection


Hi Chris,

I really appreciate the response, though I fear I may not be seeing the correlation.

In my XML I have an unknown depth of nodes all named the same thing, which means we really can't use things like <xsl:template match = ????> since it would apply to everything. All the nodes are named the same thing since enforcing some sort of naming scheme would imply limitations on depth of the menu data.

I am such a novice with XSL that I am just not understanding what you are meaning with your example.

Any help, direction, related examples, etc. is VERY appreciated!

Thanks
David S.

On 6/20/01 at 9:22 AM Chris Bayes wrote:

>David,
>Have a look on my site in the Tutorials/How To Do This section it does
>something similar to what you want. Make sure you check the XSLT stylesheet
>and not the XSL one.
>
>Ciao Chris
>
>XML/XSL Portal
>http://www.bayes.co.uk/xml
>
>
>>-----Original Message-----
>>From: owner-xsl-list@lists.mulberrytech.com
>>[mailto:owner-xsl-list@lists.mulberrytech.com]On Behalf Of
>>divaqs@yahoo.com
>>Sent: 20 June 2001 08:24
>>To: xsl-list@lists.mulberrytech.com
>>Subject: [xsl] Container HTML around recursive collection
>>
>>
>>Hi XSL-List,
>>
>>I am afraid that I am a newbie to the list. After browsing your
>>archives and FAQ it appears you are the people to come to with my
>>question. Please include my email address in your responses
>>(divaqs@yahoo.com).
>>
>>I am attempting to write some recursive XSL to iterate through XML
>>containing site navigation data. The reason it is recursive is to
>>allow for unlimited levels of sub-menus.
>>
>>The issue I am struggling with is how to enclose my collections of
>>items within their own DIV HTML. For such knowledgeable people as
>>yourselves this may seem like a simple problem that is easily
>>solved, but this is something I have been struggling with for most
>>of today. I really would appreciate any direction you might have.
>>
>>An outline of the intended XSL functionality is:
>>  A) Build first level of items
>>  B) If first level item has child items then call DIV template
>>  C) DIV template creates submenu DIV and lists child items by
>>calling Item template for childnode
>>  D) Child items are created in item template
>>  E) If Child item has its own child items then recursively call
>>DIV template again
>>
>>Resulting HTML is hoped to look something like this:
>><Master Table>
>>  <Level 1 Table>
>>    Item
>>  </Level 1 Table>
>>  <Level 1 Table>
>>    Item with childnodes
>>  </Level 1 Table>
>>    <DIV>
>>      <Level 2 Table>
>>        Item
>>      </Level 2 Table>
>>      <Level 2 Table>
>>        Item
>>      </Level 2 Table>
>>    </DIV>
>></Master Table>
>>
>>Actual Resulting HTML looks something like this:
>><Master Table>
>>  <Level 1 Table>
>>    Item
>>  </Level 1 Table>
>>  <Level 1 Table>
>>    Item with childnodes
>>  </Level 1 Table>
>>    <DIV>
>>      <Level 2 Table>
>>        Item
>>      </Level 2 Table>
>>    </DIV> <---------------------This should not be here
>>    <DIV> <---------------------This should not be here
>>      <Level 2 Table>
>>        Item
>>      </Level 2 Table>
>>    </DIV>
>></Master Table>
>>
>>HELP!!!! I am desperate and extremely frustrated.
>>
>>Here is a copy of the XSL:
>>
>><?xml version="1.0" encoding="iso-8859-1"?>
>><xsl:stylesheet version="1.0"
>>xmlns:xsl="http://www.w3.org/1999/XSL/Transform";>
>>
>>  <!-- Begin Parent Table and TableRow -->
>>  <xsl:template match="/">
>>  <TABLE class="menu" id="leftnav" border="0" cellpadding="0"
>>cellspacing="0" style="background-color:#deefff;" width="146px">
>>    <xsl:attribute name="onmouseout">if
>>(document.readyState=='complete') if
>>(!leftnav.contains(window.event.toElement))
>>{removePopup(this);}</xsl:attribute>
>>    <TR valign="top">
>>      <TD width="5"><IMG src="/images/Trans.gif" height="7"
>>width="5" /></TD>
>>      <TD class="menuTD" valign="top">
>>        <!-- Begin Call Tier1 Template -->
>>          <xsl:call-template name="Tier1">
>>            <xsl:with-param name="item" select="globalmenu/menu/item" />
>>          </xsl:call-template>
>>        <!-- End Call Tier1 Template -->
>>      </TD>
>>    </TR>
>>  </TABLE>
>>  </xsl:template>
>>  <!-- End Parent Table and TableRow -->
>>
>>  <!-- Begin the Tier1 Template -->
>>  <xsl:template name="Tier1">
>>    <xsl:param name="item" />
>>    <xsl:for-each select="$item">
>>      <TABLE>
>>      <!-- Set Table Attributes -->
>>      <xsl:attribute name="ID">ID_<xsl:value-of select="@id"
>>/></xsl:attribute>
>>      <!-- Children Conditionals -->
>>      <xsl:attribute name="class"><xsl:choose>
>>        <xsl:when test="./item">menuBar</xsl:when>
>>        <xsl:otherwise>InactiveMenuBar</xsl:otherwise>
>>      </xsl:choose></xsl:attribute>
>>      <xsl:attribute name="onmouseover"><xsl:choose>
>>        <xsl:when test="./item">rollon(this);
>>popup(ID_<xsl:value-of select="@id" />);</xsl:when>
>>        <xsl:otherwise>rollon(this);</xsl:otherwise>
>>      </xsl:choose></xsl:attribute>
>>      <xsl:attribute name="onmouseout"><xsl:choose>
>>        <xsl:when test="./item">if (!ID_<xsl:value-of select="@id"
>>/>.contains(window.event.toElement) &amp;&amp; !DIV<xsl:value-of
>>select="./item/@id" />.contains(window.event.toElement))
>>{rolloff(this);cancelPopup();</xsl:when>
>>        <xsl:otherwise>rolloff(this); cancelPopup();</xsl:otherwise>
>>      </xsl:choose></xsl:attribute>
>>      <!-- URL Conditional -->
>>      <xsl:attribute name="onclick"><xsl:if test="@url !=
>>''">javascript:location.href='<xsl:value-of select="@url"
>>/>'</xsl:if></xsl:attribute>
>>      <!-- Begin Test for Name -->
>>      <xsl:choose>
>>        <xsl:when test="@name != ''">
>>          <TR>
>>            <TD width="5"><img src="/images/Trans.gif" height="1"
>>width="5" border="0" /></TD>
>>            <TD align="left" width="100%"
>>class="menuBarFont"><xsl:value-of select="@name" /></TD>
>>            <xsl:if test="./item">
>>              <TD width="20" align="RIGHT"><img id="arrow"
>>src="images/nav_arrow.gif" width="4" height="7" align="right" /></TD>
>>            </xsl:if>
>>          </TR>
>>        </xsl:when>
>>        <xsl:otherwise>
>>          <TR><TD><BR /></TD></TR>
>>        </xsl:otherwise>
>>      </xsl:choose>
>>      <!-- End Test for Name -->
>>    </TABLE>
>>    <!-- Call SubTemplate 'DIV' (If children exist) -->
>>      <xsl:if test="./item">
>>        <xsl:for-each select="./item">
>>        <xsl:call-template name="DIV">
>>          <xsl:with-param name="item" select="." />
>>        </xsl:call-template>
>>        </xsl:for-each>
>>      </xsl:if>
>>    <!-- End Call SubTemplate 'DIV' -->
>>    </xsl:for-each>
>>  </xsl:template>
>>  <!-- End Tier1 Template -->
>>
>>  <!-- Begin Item Template -->
>>  <xsl:template name="Item">
>>    <xsl:param name="item" />
>>    <xsl:for-each select="$item">
>>      <TABLE>
>>      <!-- Set Table Attributes -->
>>      <xsl:attribute name="ID">ID_<xsl:value-of select="@id"
>>/></xsl:attribute>
>>      <!-- Children Conditionals -->
>>      <xsl:attribute name="class"><xsl:choose>
>>        <xsl:when test="./item">SubMenu</xsl:when>
>>        <xsl:otherwise>Inactive</xsl:otherwise>
>>      </xsl:choose></xsl:attribute>
>>      <xsl:attribute name="onmouseover"><xsl:choose>
>>        <xsl:when test="./item">rollon(this);
>>popup(ID_<xsl:value-of select="@id" />);</xsl:when>
>>        <xsl:otherwise>rollon(this);</xsl:otherwise>
>>      </xsl:choose></xsl:attribute>
>>      <xsl:attribute name="onmouseout"><xsl:choose>
>>        <xsl:when test="./item">if (!ID_<xsl:value-of select="@id"
>>/>.contains(window.event.toElement) &amp;&amp; !DIV<xsl:value-of
>>select="./item/@id" />.contains(window.event.toElement))
>>{rolloff(this);cancelPopup();</xsl:when>
>>        <xsl:otherwise>if (!ID_<xsl:value-of select="@id"
>>/>.contains(window.event.toElement) )
>>{rolloff(this);cancelDelay()</xsl:otherwise>
>>      </xsl:choose></xsl:attribute>
>>      <!-- URL Conditional -->
>>      <xsl:attribute name="onclick"><xsl:if test="@url !=
>>''">javascript:location.href='<xsl:value-of select="@url"
>>/>'</xsl:if></xsl:attribute>
>>      <!-- Begin Test for Name -->
>>      <xsl:choose>
>>        <xsl:when test="@name != ''">
>>          <TR>
>>            <TD width="5"><img src="/images/Trans.gif" height="1"
>>width="5" border="0" /></TD>
>>            <TD align="left" width="100%"
>>class="menuBarFont"><xsl:value-of select="@name" /></TD>
>>            <xsl:if test="./item">
>>              <TD width="20" align="RIGHT"><img id="arrow"
>>src="images/nav_arrow.gif" width="4" height="7" align="right" /></TD>
>>            </xsl:if>
>>          </TR>
>>        </xsl:when>
>>        <xsl:otherwise>
>>          <TR><TD><BR /></TD></TR>
>>        </xsl:otherwise>
>>      </xsl:choose>
>>      <!-- End Test for Name -->
>>    </TABLE>
>>    <!-- Call SubTemplate 'DIV' (If children exist) -->
>>      <xsl:if test="./item">
>>        <xsl:for-each select="./item">
>>        <xsl:call-template name="DIV">
>>              <xsl:with-param name="item" select="." />
>>        </xsl:call-template>
>>        </xsl:for-each>
>>      </xsl:if>
>>    <!-- End Call SubTemplate 'DIV' -->
>>    </xsl:for-each>
>>  </xsl:template>
>>  <!-- End Item Template -->
>>
>>  <!-- Begin DIV Template  -->
>>  <xsl:template name="DIV">
>>    <xsl:param name="item" />
>>    <DIV width="90" class="floatingMenu" name="floatingMenu"
>>style="POSITION:absolute;Z-INDEX:15;LEFT:30px;TOP:100px;DISPLAY:none;">
>>      <xsl:attribute name="ID">DIV<xsl:value-of
>>select="./item/@id" /></xsl:attribute>
>>      <xsl:attribute
>>name="onmouseout">if(document.readyState=='complete'){if(!leftnav.c
>>ontains(window.event.toElement)&amp;&amp;!DIV<xsl:value-of
>>select="./item/@id"
>>/>.contains(window.event.toElement)){removePopup(this);}if(!DIV<xsl
>>:value-of select="./item/@id"
>>/>.contains(window.event.toElement)){rolloff(DIV<xsl:value-of
>>select="@id" />);}}</xsl:attribute>
>>        <!-- Call SubTemplate 'Item' (If children exist) -->
>>          <xsl:for-each select=".">
>>          <xsl:call-template name="Item">
>>                <xsl:with-param name="item" select="." />
>>          </xsl:call-template>
>>          </xsl:for-each>
>>        <!-- End Call SubTemplate 'Item' -->
>>    </DIV>
>>  </xsl:template>
>>  <!-- End DIV Template -->
>>
>></xsl:stylesheet>
>>
>>What is happening is that rather then the collection of menu items
>>(each in their own table) being all enclosed within the DIV, the
>>items instead have a DIV around each of them.
>>
>>Here is some example XML:
>><globalmenu>
>>   <menu name="Foo Menu" url="">
>>      <item id="1" url="" name="Foo Information">
>>        <item id="1_1" url="10025overview.asp" name="Overview" />
>>        <item id="1_2" url="10025req.asp" name="Foo Requirements" />
>>        <item id="1_3" url="10025faq.asp" name="Downloadable FAQs" />
>>        <item id="1_4" url="10025info.asp" name="Foo Information" />
>>        <item id="1_5" url="10025related.asp" name="Related Foo" />
>>        <item id="1_7" url="10025features.asp" name="Foo Features" />
>>      </item>
>>      <item id="2" url="" name="Foo Tools">
>>        <item id="2_1" url="/tools.asp?dirID=Pleasure" name="Pleasure" />
>>        <item id="2_2" url="/tools.asp?dirID=Anti-Foo" name="Anti Foo" />
>>     </item>
>>   </menu>
>></globalmenu>
>>
>>Please, please, I really could use some insight on how to get this to
>work.
>>
>>Thanks
>>David S.
>>
>>
>> XSL-List info and archive:  http://www.mulberrytech.com/xsl/xsl-list
>>
>>
>
>
> XSL-List info and archive:  http://www.mulberrytech.com/xsl/xsl-list




 XSL-List info and archive:  http://www.mulberrytech.com/xsl/xsl-list


Index Nav: [Date Index] [Subject Index] [Author Index] [Thread Index]
Message Nav: [Date Prev] [Date Next] [Thread Prev] [Thread Next]