xslt link values are escaping the link

Go to solution

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

syn-rg 282 posts 425 karma points

Mar 30, 2011 @ 08:19

I have an XSLT project gallery, that is populated by the child nodes.

Sometimes on the front end the link isn't pulling in all of the values to display within the link.

<li>
              <div id="project">
                <a>
                  <xsl:attribute name="href">
                    <xsl:value-of select="umbraco.library:NiceUrl(@id)" />
                  </xsl:attribute>
                  <img src="{concat(substring-before(./*/projectImage,'.'), '_thumb_180.jpg')}"/>
                  <div id="details">
                    <h2><xsl:value-of select="umbraco.library:FormatDateTime(completionDate, 'MMMM yyyy')"/></h2>
                    <xsl:value-of select="umbraco.library:RemoveFirstParagraphTag(pageTitle)" disable-output-escaping="yes" />
                    <p><xsl:value-of select="projectLocation" />,&nbsp;<xsl:value-of select="projectState" /></p>
                  </div>
                </a>
              </div>
            </li>

This should appear as a link on the front end with the <a>img, h2 text, page title value, and p text</a>

<a href="/projects/projects/specialty/page.aspx"><img src="/media/34716/01_thumb_180.jpg"><div id="details"><h2>February 2009</h2><h1>Project</h1><p>Melbourne,&nbsp;VIC</p></div></a>

But sometimes the link is appearing as <a>img</a> h2 text, page title value, p text

<a href="/projects/projects/specialty/page.aspx"><img src="/media/34716/01_thumb_180.jpg"></a><div id="details"><h2>February 2009</h2><h1>Project</h1><p>Melbourne,&nbsp;VIC</p></div>

Any suggestions to help fix this?

Cheers,
JV

Copy Link

Kim Andersen 1447 posts 2196 karma points MVP

Mar 30, 2011 @ 08:29

0

Hi JV

Maybe this happens because you are wrapping the a-tag around div and p tags. This is perfectly valid in HTML5 (well, now it's just called HTML, but in this case I'll call it HTML5 for no confusion), but I'm not sure if some of the older browsers will mess up some small parts of the DOM like you describe above.

Does this only happen in some browsers? And if so, which ones?

/Kim A

Copy Link
syn-rg 282 posts 425 karma points

Mar 31, 2011 @ 01:11
0
Hi Kim,

The code when it fails still wraps the a tag around all the h1, h2 and p tags. So with a change to my CSS I've managed to fix the problem. It still fails occasionally in Firefox 3.6 and Safari 4.1, but with the following additions to my CSS it still displays perfectly and links correctly.

I previously just had:
```
#project_gallery #project h1 { styles, etc }
```
Now I've added the following as well, this applies when the a tag doesn't wrap all the h1, h2 and p tags:
```
#project_gallery #project h1 a:link, #project_gallery #project h1 a:active, #project_gallery #project h1 a:visited, #project_gallery #project h1 a:hover { styles, etc }
```
It's a bandaid fix, but it's still working. A good solution for older browsers.

Cheers,
JV
Copy Link
is working on a reply...

Please Sign in or register to post replies