Telerik rad editor adds <p> tags

2 posts, 0 answers
  1. Ritesh
    Ritesh avatar
    1 posts
    Member since:
    Oct 2011

    Posted 25 Oct 2011 Link to this post

    Hi,
    We are using Telerik rad editor control on one of our web pages. The issue I am facing is that the editor seems to be adding several <p>  tags in the html. I am aware that you"ll have a few forums where this is discussed but the scenarios are always different and there does not seem to be a fixed answer. I have tried some some of the solutions mentioned in those forums i,.e setting the NewLineBr (tried both true and false) and disabling the ConvertToXhtml filter. The NewLineBr did not work at all . However the ConvertToXhtml filter gave mixed success in the sense that it changed the color attributes in the HTML for eg
    color: #663366 to color: rgb(102, 51, 102);
    This may be effectively the same thing but it is still different HTML. Hence it makes me feel a little uncomfortable using this filter as I am not aware of any pros and cons of using this.
    Can somebody let me know if there is any other way to fix this issue. As a sample please see the HTML below. Note that when <p> tags are inserted it looks like:
     <p style="text-align: center;"><span style="font-family: arial; color: #663366; font-size: 16px;">Activity</span></p>              <p>              </td>
    Also the tags are inserted from server side as well as client side( i.e. when we switch back and forth between design and HTML views)
    <p style="text-align: right;"> </p>
    <p> <span style="line-height: 1.33em; font-family: arial; color: #663366; font-size: 24px;">Prepare sales materials</span> </p>
    <p>
    <table style="width: 100%;" border="1" cellpadding="10">
        <tbody>
            <tr>
                <td style="width: 50%;" valign="top">
                <p style="text-align: center;"><span style="font-family: arial; color: #663366; font-size: 16px;">Activity</span></p>
                </td>
                <td style="width: 50%;" valign="top">
                <p style="text-align: center;"><span style="font-family: arial; color: #663366; font-size: 16px;">How to</span></p>
                </td>
            </tr>
            <tr>
                <td valign="top"><span style="font-family: arial; color: #663366; font-size: 14px;">
                <ol>
                    <li>Prepare appropriate literature: brochures, white papers, and journal articles </li>
                </ol>
                </span></td>
                <td valign="top"><span style="font-family: arial; color: #663366; font-size: 14px;">
                <ul>
                    <li>Order Literature through <a href="http://hospira.litorders.com/" target="_blank"><span style="color: #3333ff;">Comac</span></a><span style="color: #3333ff;"> </span></li>
                </ul>
                <p><a href="https://www.gosavo.com/prod/Post/Post.aspx?id=955015&;view="><strong><span style="color: #663366;">Click Here</span></strong></a><span style="color: #663366;"> for EffectIV<span style="font-family: arial,sans-serif;"><sup>TM  </sup></span><br />
                </span><a href="https://www.gosavo.com/prod/Post/Post.aspx?id=955027&;view="><strong><span style="color: #663366;">Click Here</span></strong></a><span style="color: #663366;"> for AMC<span style="font-family: arial,sans-serif;"><sup>TM </sup></span><br />
                </span><a href="https://www.gosavo.com/prod/Post/Post.aspx?id=955068&;view="><strong><span style="color: #663366;">Click Here</span></strong></a><span style="color: #663366;"> for <span style="font-family: arial,sans-serif;">ChemoCLAVE<sup><span style="font-size: 13px;">TM</span> </sup></span></span></p>
                </span></td>
            </tr>
            <tr>
                <td style="background-color: #e2e2e2;" valign="top"><span style="font-family: arial; color: #663366; font-size: 14px;">
                <ol start="2">
                    <li>Order product samples </li>
                </ol>
                </span></td>
                <td style="background-color: #e2e2e2;" valign="top"><span style="font-family: arial; color: #663366; font-size: 14px;">
                <ul>
                    <li>Complete a <a href="http://DELTA Demo Unit Order form" target="_blank"><span style="color: #3333ff;">DELTA Demo Unit Order form</span></a>  and fax into the Delta program </li>
                </ul>
                </span></td>
            </tr>
            <tr>
                <td valign="top"><span style="font-family: arial; color: #663366; font-size: 14px;">
                <ol start="3">
                    <li>Ensure computer tools are loaded on computer </li>
                </ol>
                </span></td>
                <td valign="top"><span style="font-family: arial; color: #663366; font-size: 14px;">
                <ul>
                    <li>CLAVE<span style="font-family: arial,sans-serif;"><sup>TM</sup></span> Computer Selling Tool </li>
                </ul>
                </span></td>
            </tr>
            <tr>
                <td style="background-color: #e2e2e2;" valign="top"><span style="font-family: arial; color: #663366; font-size: 14px;">
                <ol start="4">
                    <li>Recommended product configurations </li>
                </ol>
                </span></td>
                <td style="background-color: #cccccc;">
                <ul>
                    <li><span style="color: #663366; font-size: 14px;">This can be done with literature, based on customer's best practice. </span></li>
                </ul>
                </td>
            </tr>
        </tbody>
    </table>
    </p>
  2. Rumen
    Admin
    Rumen avatar
    14361 posts

    Posted 28 Oct 2011 Link to this post

    Hi Ritesh,

    It seems that you are using an older version because the <p> tag multiplication problem should be fixed or at least greatly reduced in the latest Q2 2011 SP1 build of RadEditor. I tested the provided content and I was unable to reproduce the issue when the ConvertToXhtml filter is enabled. Are you able to reproduce the problem in the following demo: Built-in Content Filters.

    The purpose of the NewLineBr property is to insert <br> or <p> tag when the Enter key is pressed and it has noting to do with the content filters of RadEditor and the problem.

    The problem appears only when the ConvertToXhtml filter is enabled, because this DOM filter does not work well with not well formed content <p><span>text</p></span>.

    The ForeColor command of the non IE browsers applies RGB inline color styles:
    <span style="color: rgb(255, 0, 0);">text</span>

    It is the ConvertToXhtml filter that converts the RGB values to hex # colors

    <span style="color: #ff0000;">text</span>

    Best regards,
    Rumen
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
Back to Top