How do I render IE6/IE7 conditional comments in XSLT? Options
warren
Posted: Tuesday, March 06, 2007 4:37:33 PM

Rank: Addict

Joined: 7/19/2006
Posts: 777
Location: Leigh-on-Sea, Essex, UK
Hello all,
I am using a pure CSS navigation, which needs some IE6 conditional comments for it to work properly in IE6.

Below is an example of a conditional comment that needs to be written via the XSLT
<!--[if lte IE 6]><table><tr><td><![endif]-->

As this looks like a normal comment XSLT does not render as I need it to, is there anyway around this?

Thanks,
Warren

Warren Buckley an Umbraco MVP 08-09 & level 1 certified developer
sjors
Posted: Tuesday, March 06, 2007 5:09:08 PM

Rank: Fanatic

Joined: 7/20/2006
Posts: 408
Location: Amsterdam
Hi Warren, is it maybe not easier to make one XSLT that selects the right CSS for the right browser? Just an idea ;)
bootnumlock
Posted: Wednesday, March 07, 2007 4:55:29 PM

Rank: Fanatic

Joined: 10/9/2006
Posts: 419
hey warren... great minds... i am doing the exaxt same thing right now and have the same stumble... for some reason... the xslt skips the comments completely...

[cdata] tags???

bootnumlock - aka bob baty-barr [http://www.baty-barr.com]
Level 1 Certified!
bootnumlock
Posted: Wednesday, March 07, 2007 5:35:41 PM

Rank: Fanatic

Joined: 10/9/2006
Posts: 419
i tried CDATA and xsl:comment... no joy...

issue appears to be that i have a closing </a> tag inside one of the conditions... if you figure anything out, let me know...

becaue of the conditional rendering of table elements i am not sure that conditional css at the template level will even work for this...

i can't believe i am considering dumping ie6 already :)

unfortunately, i have clients that have not upgraded....

bootnumlock - aka bob baty-barr [http://www.baty-barr.com]
Level 1 Certified!
drobar
Posted: Wednesday, March 07, 2007 7:56:00 PM

Rank: Umbracoholic

Joined: 9/8/2006
Posts: 1,698
Location: KY, USA
Okay, guys, here's something to try out... BrowserDetection 1.0.

I wrote it a year ago for a project and, just as I was about to use it, there was a change in the site and I didn't need it. Sounds like you might be able to use it. I haven't tried it with IE7, but don't expect it will be a problem.

Simple to use, exceedingly flexible, and complete documentation. Get BrowserDetection 1.0 at http://www.percipientstudios.com/downloads/umbraco/BrowserDetection1.0.zip.

Let me know how it works for you.

cheers,
doug.

MVP 2007-2009 - Official Umbraco Trainer for North America - Percipient Studios
bootnumlock
Posted: Wednesday, March 07, 2007 11:35:14 PM

Rank: Fanatic

Joined: 10/9/2006
Posts: 419
okay you xslt geniuses.... how would i craft this with xslt?

never mind the contidional -- let' just say, how would i write it with the IE6 stuff in line...
Code:
<div class="menu">
<ul>
<li><a href="../index.html">Item 1</a></li>
<li><a href="#nogo">Item 2</a></li>
<li class="sub"><a href="#nogo">Item 3 &#187;<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
    <ul>
    <li><a href="../index.html">Item 3a</a></li>
    <li class="sub"><a href="#nogo">Item 3b &#187;<!--[if IE 7]><!--></a><!--<![endif]-->
    <!--[if lte IE 6]><table><tr><td><![endif]-->
        <ul>
            <li><a href="../index.html">Item 3bi</a></li>
            <li><a href="#nogo">Item 3bii</a></li>
            <li class="sub"><a href="#nogo">Item 3biii &#187;<!--[if IE 7]><!--></a><!--<![endif]-->
            <!--[if lte IE 6]><table><tr><td><![endif]-->
                <ul>
                    <li><a href="#nogo">Item 3biii-1</a></li>
                    <li><a href="#nogo">Item 3biii-2</a></li>
                    <li><a href="#nogo">Item 3biii-3</a></li>
                    <li><a href="#nogo">Item 3biii-4</a></li>
                </ul>
            <!--[if lte IE 6]></td></tr></table></a><![endif]-->
            </li>
        </ul>
    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
    </li>
    <li><a href="#nogo">Item 3c</a></li>
    </ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
    </li>
<li><a href="#nogo">Item 4</a></li>
<li><a href="#nogo">Item 5</a></li>
<li><a href="#nogo">Item 6</a></li>

</ul>
</div>


Here is my start -- but i am having trouble placing the F-ing HTML tags to make it work for IE6

Code:
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet
    version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:msxml="urn:schemas-microsoft-com:xslt"
    xmlns:umbraco.library="urn:umbraco.library"
    exclude-result-prefixes="msxml umbraco.library">


<xsl:output method="xml" omit-xml-declaration="yes"/>

<xsl:param name="currentPage"/>
<xsl:variable name="level" select="2"/>

<xsl:template match="/">

    <ul>
        <xsl:for-each select="$currentPage/ancestor-or-self::node [@level=$level]/node [string(./data [@alias='umbracoNaviHide']) != '1' ]">

            <li>

                <a href="{umbraco.library:NiceUrl(@id)}" rel="{@nodeTypeAlias}" >
                    <xsl:if test="$currentPage [@id = current()/@id]/@nodeName != ''">
                        <xsl:attribute name="class">currentPage</xsl:attribute>
                    </xsl:if>
                    <xsl:if test="$currentPage/ancestor::node [@id = current()/@id]/@nodeName != ''">
                        <xsl:attribute name="class">currentSection</xsl:attribute>
                    </xsl:if>
                    <xsl:variable name="umbracoTitle" select="./data [@alias = 'thePageTitle']"/>
                    <xsl:choose>
                        <xsl:when test="$umbracoTitle != ''">
                            <xsl:attribute name="title"><xsl:value-of select="$umbracoTitle"/></xsl:attribute>
                        </xsl:when>
                        <xsl:otherwise>
                            <xsl:attribute name="title"><xsl:value-of select="@nodeName"/></xsl:attribute>
                        </xsl:otherwise>
                    </xsl:choose>
                    <xsl:value-of select="@nodeName"/>
                </a>
                
            
                
                    <xsl:if test="count(./node [string(./data [@alias='umbracoNaviHide']) != '1']) &gt; 0">
                        <xsl:call-template name="printSubs">
                            <xsl:with-param name="parent" select="."/>
                        </xsl:call-template>
                    </xsl:if>
                
            </li>
            </xsl:for-each>
    </ul>
    
</xsl:template>

<xsl:template name="printSubs">
    <xsl:param name="parent"/>
    <ul>
        <xsl:for-each select="$parent/node [string(./data [@alias='umbracoNaviHide']) != '1' ]">

            <li class="sub">
                <a href="{umbraco.library:NiceUrl(@id)}" rel="{@nodeTypeAlias}">
                    <xsl:if test="$currentPage [@id = current()/@id]/@nodeName != ''">
                        <xsl:attribute name="class">currentPage</xsl:attribute>
                    </xsl:if>
                    <xsl:if test="$currentPage/ancestor::node [@id = current()/@id]/@nodeName != ''">
                        <xsl:attribute name="class">currentSection</xsl:attribute>
                    </xsl:if>
                    <xsl:variable name="umbracoTitle" select="./data [@alias = 'Title']"/>

                    <xsl:choose>
                        <xsl:when test="$umbracoTitle != ''">
                            <xsl:attribute name="title"><xsl:value-of select="$umbracoTitle"/></xsl:attribute>
                        </xsl:when>
                        <xsl:otherwise>
                            <xsl:attribute name="title"><xsl:value-of select="@nodeName"/></xsl:attribute>
                        </xsl:otherwise>
                    </xsl:choose>
                    <xsl:value-of select="@nodeName"/>
                
                        

                    <xsl:if test="(count(./node [string(./data [@alias='umbracoNaviHide']) != '1' ]) &gt; 0) and (count(./node [string(../data [@alias='HideChild']) != '1' ]) &gt; 0)">
                        <xsl:call-template name="printSubs">
                            <xsl:with-param name="parent" select="."/>
                        </xsl:call-template>
                    </xsl:if>
                <table><tr><td>
            </li>
        </xsl:for-each>
    </ul>
    </td></tr></table></a>
</xsl:template>

</xsl:stylesheet>


thanks for any help any of you ma provide...

PS... Doug, thanks for the browser check... now i just have to craft to version of the xslt for conditional macro inclusion :)

bootnumlock - aka bob baty-barr [http://www.baty-barr.com]
Level 1 Certified!
warren
Posted: Thursday, March 08, 2007 10:05:02 AM

Rank: Addict

Joined: 7/19/2006
Posts: 777
Location: Leigh-on-Sea, Essex, UK
Hello Bob,
Looks like you are looking at the same CSS dropdown code that I am currently looking at.

Here is my XSLT so far, but is yet finished. I will be updating it tomorrow most likely.
http://adventureisland.momo.co.uk/xslt/NavigationDropDown.xslt

Your XSLT code looks more involved and I worry I may be missing something or doing somethign wrong in my XSLT, it would be good to talk and swap ideas.

Warren :)

Warren Buckley an Umbraco MVP 08-09 & level 1 certified developer
cpalm
Posted: Thursday, March 08, 2007 10:17:48 AM

Rank: Aficionado

Joined: 7/19/2006
Posts: 164
To get this in output HTML
Code:
<!-- ||This is a comment|| -->

You write this in your XSLT
Code:
<xsl:comment> ||This is a comment|| </xsl:comment>




CPalm, www.cpalm.dk
cpalm
Posted: Thursday, March 08, 2007 10:27:07 AM

Rank: Aficionado

Joined: 7/19/2006
Posts: 164
I was to quick

Here is the full solution to get
<!--[if lte IE 6]><table><tr><td><![endif]-->

Code:
<xsl:comment>[if lte IE 6]> <xsl:text disable-output-escaping="yes">&lt;</xsl:text>table <xsl:text disable-output-escaping="yes">&gt;</xsl:text> <xsl:text disable-output-escaping="yes">&lt;</xsl:text>tr<xsl:text disable-output-escaping="yes">&gt;</xsl:text><xsl:text disable-output-escaping="yes">&lt;</xsl:text>td<xsl:text disable-output-escaping="yes">&gt;</xsl:text><xsl:text disable-output-escaping="yes">&lt;</xsl:text>![endif]</xsl:comment>


CPalm, www.cpalm.dk
bootnumlock
Posted: Thursday, March 08, 2007 4:40:45 PM

Rank: Fanatic

Joined: 10/9/2006
Posts: 419
@warren...

i went with another menu that did not have conditional css tags to render properly in ie6, etc.

i found it at dynamic drive...
http://www.dynamicdrive.com/style/csslibrary/item/suckertree-menu-vertical/

it does use javascript to loop through the subnavs... but it works...
you can check it out here...
http://jimhenry.strenghosting.com/our-products.aspx

it is the menu on the left... NOT THE TOP -- that is component art.



bootnumlock - aka bob baty-barr [http://www.baty-barr.com]
Level 1 Certified!
johanklein
Posted: Monday, January 28, 2008 12:16:31 PM
Rank: Newbie

Joined: 9/26/2007
Posts: 5
Location: Amsterdam
Hello all,

After hours of trying and crying, I've managed to get this running. Check out the XSLT below.

Code:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE xsl:Stylesheet [ <!ENTITY nbsp "&#x00A0;"> ]>
<xsl:stylesheet
    version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:msxml="urn:schemas-microsoft-com:xslt"
    xmlns:umbraco.library="urn:umbraco.library"
    exclude-result-prefixes="msxml umbraco.library">

<xsl:output method="html" indent="yes" omit-xml-declaration="yes" />

<xsl:param name="currentPage"/>

<xsl:variable name="currentID" select="$currentPage/self::node/@id"/>
<xsl:variable name="level" select="1"/>

<xsl:template match="/">

<xsl:call-template name="printListe">
    <xsl:with-param name="node" select="$currentPage/ancestor-or-self::node [@level = $level]"/>
    <xsl:with-param name="id" select="string('pmenu')"/>    
</xsl:call-template>
</xsl:template>

<xsl:template name="printListe">
<xsl:param name="node"/>
<xsl:param name="id"/>

<ul>
<xsl:if test="$id != ''">
<xsl:attribute name="id"><xsl:value-of select="$id"/></xsl:attribute>
</xsl:if>
<xsl:for-each select="$node/node [string(./data [@alias='umbracoNaviHide']) != '1']">
<li>
    <xsl:if test="current()/parent::node/@id = $currentID">
            <xsl:attribute name="class">drop</xsl:attribute>
        </xsl:if>

    <xsl:if test="(@level = 3) and (./node/@level = 4)">
            <xsl:attribute name="class">fly</xsl:attribute>
        </xsl:if>

    <xsl:if test="count(./node) = 0">
        <a href="{umbraco.library:NiceUrl(@id)}">
            <xsl:if test="position()=1">
                <xsl:attribute name="class">enclose</xsl:attribute>
            </xsl:if>
        <xsl:value-of select="@nodeName"/>
        </a>
    </xsl:if>

    <xsl:if test="count(./node) &gt; 0">
        <a href="{umbraco.library:NiceUrl(@id)}">
        <xsl:if test="position()=1">
            <xsl:attribute name="class">enclose</xsl:attribute>
        </xsl:if>
        <xsl:value-of select="@nodeName"/>
        
        <xsl:comment>[if IE 7]>&lt;!</xsl:comment></a><xsl:comment>&lt;![endif]</xsl:comment>
        <xsl:comment>[if lte IE 6]>&lt;table>&lt;tr>&lt;td>&lt;![endif]</xsl:comment>
        
    </xsl:if>
    
    <xsl:if test="count(./node) &gt; 0">
        <xsl:call-template name="printListe">
            <xsl:with-param name="node" select="."/>
        </xsl:call-template>
    </xsl:if>
       
    </li>
</xsl:for-each>
</ul>

<xsl:comment>[if lte IE 6]>&lt;/td>&lt;/tr>&lt;/table>&lt;/a>&lt;![endif]</xsl:comment>

</xsl:template>
</xsl:stylesheet>





Cylogy | Content Management Specialists & Solutions | www.cylogy.nl | The Netherlands
Users browsing this topic
Guest


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.