Avatar billede nielyng Nybegynder
04. maj 2009 - 10:05 Der er 5 kommentarer

Korrekt UL-LI navigation

Hej alle

Jeg har bøvlet en smule med at lave en stump xslt der kan transformere mit xml om til en fornuftig html ul-li struktur til brug som navigation.

Jeg ønsker at strukturen er som her med korrekt nestede lister;
<ul>
<li>item 1</li>
<li>item 2 med undermenu
<ul>
<li>undermenu item</li>
</ul>
<li> item 3</li>
</ul>

Min XML ser således her ud;

<navigator currentUrl="/byggeri/niv2/niv22/niv3/niv4/sider/startside.aspx" sectionTitle="Byggeri">
        <section url="/byggeri/niv2/sider/startside.aspx" level="1">
            <portalSiteMapNode url="/byggeri/niv2/sider/startside.aspx" title="websted niv 2" childnodes="True">
                <description>NL test</description>
            </portalSiteMapNode>
            <section url="/byggeri/niv2/niv22/sider/startside.aspx" level="2">
                <portalSiteMapNode url="/byggeri/niv2/niv22/sider/startside.aspx" title="Websted rigtig 2" childnodes="True">
                    <description>rigtig niv 2</description>
                </portalSiteMapNode>
                <section url="/byggeri/niv2/niv22/niv3/sider/startside.aspx" level="3">
                    <portalSiteMapNode url="/byggeri/niv2/niv22/niv3/sider/startside.aspx" title="websted niv 3" childnodes="True">
                        <description>websted niv 3</description>
                    </portalSiteMapNode>
                    <section url="/byggeri/niv2/niv22/niv3/niv4/sider/startside.aspx" level="4">
                        <portalSiteMapNode url="/byggeri/niv2/niv22/niv3/niv4/sider/startside.aspx" title="websted niv 4" childnodes="True">
                            <description>niv 4</description>
                        </portalSiteMapNode>
                        <section level="5"/>
                    </section>
                </section>
            </section>
        </section>
    </navigator>

Kom med et bud på en stump xslt der kan give ovenstående liste-struktur, jeg mangler overblikket..
Avatar billede nielyng Nybegynder
04. maj 2009 - 10:06 #1
*korrekt struktur*
<ul>
<li>item 1</li>
<li>item 2 med undermenu
<ul>
<li>undermenu item</li>
</ul>
</li>
<li> item 3</li>
</ul>
Avatar billede jokkejensen Novice
11. maj 2009 - 14:30 #2
Du skal løbe dem alle igennem og se om de har børn.

følgende er skrevet herinde, så det skal lige testes.

<xsl:template match="/">
<xsl:if test="section"> <!-- Er der nogle undernoder til root -->
<ul>
<xsl:apply-templates select="section" /> <-- behandl dem -->
</ul>
</xsl:if>
</xsl:template>

<xsl:template match="section">
<li class="level{@level}">
<a href="{@url}"><xsl:value-of select="portalSiteMapNode/@title" /></a>
<xsl:if test="section">
<ul class="level{number(@level)+1}">
<xsl:apply-templates select="section" />
</ul>
</xsl:if>
</li>

</xsl:template>

Håber du forstår.

/J
Avatar billede ralley Nybegynder
07. juli 2009 - 23:50 #3
Hej nielyng

Mit forslag ser sådan her ud:
<?xml version="1.0" encoding="utf-8" ?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

    <xsl:template match="/">
        <xsl:apply-templates select="navigator[section]" />
    </xsl:template>
   
    <xsl:template match="navigator[section]">
        <ul id="level{section/@level}">
            <xsl:apply-templates select="section" />
        </ul>
    </xsl:template>
   
    <xsl:template match="section[portalSiteMapNode]">
        <li>
            <xsl:apply-templates select="portalSiteMapNode" />
            <xsl:if test="section">
                <ul id="level{section/@level}">
                    <xsl:apply-templates select="section" />
                </ul>
            </xsl:if>
        </li>
    </xsl:template>
   
    <xsl:template match="portalSiteMapNode">
        <a href="{@url}">
            <xsl:apply-templates select="@title" />
            <xsl:apply-templates select="description" />
        </a>
    </xsl:template>
   
    <xsl:template match="@title">
        <xsl:attribute name="title">
            <xsl:value-of select="." disable-output-escaping="yes" />
        </xsl:attribute>
    </xsl:template>
       
    <xsl:template match="description">
        <xsl:value-of select="." disable-output-escaping="yes" />
    </xsl:template>

</xsl:stylesheet>

// Dammark
Avatar billede jokkejensen Novice
08. juli 2009 - 08:49 #4
Du kan godt havne i en situation hvor id ikke er uniqt, så den holder ikke i moderne markup.

/J
Avatar billede ralley Nybegynder
09. juli 2009 - 16:30 #5
Hej Jokke

Det har du helt ret i, det er en typo.
Der skulle ha stået 'class' istedet for 'id' på mine ul-tags.

// Sebastian
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Kurser inden for grundlæggende programmering

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester