Decorating away <span>-tags using Telerik RAD Editor with Microsoft Content Management Server 2002

I’ve latly been working on a MCMS 2002 project where one of the primary gools have
been to make the public part of the site accessable following WAI
recomendations
. So in order to do that I went for Xhtml
1.0 Transitional
. The ActiveX content editor shipping with MCMS 2002 is not compliant
with xhtml standard (I secretly wonder if it’s compliant with any html standard).
It does stuff like not ending <li>-tags. 

The Problem

So I found Telerik
r.a.d editor Lite Edition
. It has has a license model where licensed MCMS 2002
customers are allowed to use it whitout any extra cost. The Telerik editor seemd to
work as a charm, with one ”small” issue. It put’s <span>-tags around it’s output.
According to XHTML it’s not allowed place block-level elements (such as <p>
or <table>) inside an inline element (such as <a>, <span> or
<font>). And there is your problem right there.

The Solution

Inpired of Paul Haack’s exellent post ”Using
a Decorator to Hook Into A WebControl’s Rendering for Better XHTML Compliance

I set of doing the following.

First off I have created my own HtmlTextWriter class in for the purpose you can read
about in Pual’s post.

publicclass CompliantHtmlTextWriter
: HtmlTextWriter
{
    internal CompliantHtmlTextWriter(HtmlTextWriter
writer) : base(writer)
    {
    }

    publicoverridevoid AddAttribute(string name, string value)
    {
        if(IsLanguageAttribute(name))
        {
            return;
        }

        base.AddAttribute
(name, value);
    }

    privatebool IsLanguageAttribute(string name)
    {
        return String.Compare(name, ”language”, true,
CultureInfo.InvariantCulture) == 0;
    }
}

Since I could see no conflict with what I’m about to do I reused it. Second step is
to inherit from the Telerik editor Placehoder RadEditorPlaceHolderControl and decorate
it a little.

publicclass CompliantRadEditor
: RadEditorPlaceHolderControl
{
    public CompliantRadEditor()
: base()
    {
    }

    protectedoverridevoid Render(System.Web.UI.HtmlTextWriter
writer)
    {
        base.Render
(new CompliantHtmlTextWriter(writer));
    }

    protectedoverride HtmlTextWriterTag
TagKey
    {
        get
        {
            return HtmlTextWriterTag.Div;
        }
    }
}

As you can see I don’t mess with much. The magic of course happens in the overridden
TagKey property.

I had to override the Render method to and put in my own HtmlTextWriter to work. I
don’t really understand why but if I didn’t I got really weird output. But there you
have it; hopefully this is helpful to someone.

 

Update 2006-03-28:

In the name of usability I realized I shoud supply some example code for the aspx-pages
to. So in the Foo.aspx fiile you need to change the reference from:

<%@
Register TagPrefix=”Teleric” Namespace=”Telerik.WebControls” Assembly=”RadEditorPlaceHolder” %>

to something like:

<%@
Register TagPrefix=”XhtmlCompliance” Namespace=”MyProject.XhtmlCompliance” Assembly=”MyProject” %>

And when using the editor in the html page change:

<Teleric:RadEditorPlaceHolderControl
id=”Radeditorplaceholdercontrol1” runat=”server” PlaceholderToBind=”FooPH”></Teleric:RadEditorPlaceHolderControl> 

To
use the ”new” editor:

<XhtmlCompliance:CompliantRadEditor
id=”Radeditorplaceholdercontrol1” runat=”server” PlaceholderToBind=”FooPH”></XhtmlCompliance:CompliantRadEditor>

One thought on “Decorating away <span>-tags using Telerik RAD Editor with Microsoft Content Management Server 2002

  1. Hi, this problem is present in all MCSM placeholders. It comes form the fact that the base class for all placeholders (BasePlaceholderControl) has the span tag as a default around all content. The Telerik editor is also a BasePlaceholderControl with inherited methods.

    The easiest way around this is to override the two methods RenderBeginTag, and RenderEndTag.

    using System;
    using System.Web.UI;
    using Telerik.WebControls;
    namespace MyTelerikEditor
    {
    public class MyRadEditor:RadEditorPlaceHolderControl
    {
    public MyRadEditor (): base()
    {
    }

    override public void RenderBeginTag(HtmlTextWriter writer){
    writer.Write(&quot;&quot;);
    }

    override public void RenderEndTag(HtmlTextWriter writer)
    {
    writer.Write(&quot;&quot;);
    }
    }
    }

    Then use MyRadEditor as a control in all your templates and the span tags are history. If you want a div tag just replace the empty string with a start and end div.

Comments are closed.