I am trying to use the anchor button in a RTF field of a Component, and getting unexpected behavior. Using the Chrome Browser from the design view, I highlight/select the heading (i.e. <h2>My Heading</h2>) I want to use as an anchor, and press the anchor button and enter the anchor name (i.e. my_place).
This results in the following code being displayed in my source tab:
<a name="my_place" id="myplace"/><h2>My Heading</h2>
This causes render problems when displaying the HTML in a browser due to the self closing <a/> tag.
I would have expected one of the following three HTML fragments being inserted into the HTML source:
<a name="my_place" id="myplace"><h2>My Heading</h2></a>
or
<h2><a name="my_place" id="myplace">My Heading</a></h2>
or
<a name="my_place" id="myplace"><a><h2>My Heading</h2>
Has anyone else experienced this? or know of a way to achieve what I had expected (without manually editing the HTML). Or is this a bug in the current version of the product.
Attached is my sample XSLT template:
<template match="a[(@name) and (count(node()) = 0)]">
<copy>
<apply-templates select="@*"/>
<xhtml:span xmlns:xhtml="http://www.w3.org/1999/xhtml" class="hidden"> </xhtml:span>
</copy>
</template>
This adds a bit more than strictly needed, but handles some other issues we have due to XML manipulation on the Content Delivery side.
Essentially it matches all empty a tags with a name attribute, and add something between them in order to stop them self closing. In our case we post process all of the XML with XSLT, so we have challenges with empty tags getting closed all the time. So as a dirty hack, we are now inserting a hidden span tag between empty tags to prevent the issue.