[Solved] Unable to restrict or alias styles in the drop-down list in the ApplyClass tool

[Joseph Alfano]

Hi,

I am using RadControls "Prometheus", version 2007.3.1425.35. With the RadEditor control, I am trying to control the styles that appear in the dropdown list for the "ApplyStyles" tool  button.  I point to an external CSS file using the <CssFiles> node in the RadEditor control, and all of the styles appear in the dropdown list.  However, when I try to restrict the ones that appear, and alias them with different names, using the <CssClasses> node, all of the classes in the CSS file still appear, and their names are not aliased.

Here is my CSS file:

.class1 {text-decoration:underline;color:Red}
.class2 {font-weight:bold;font-size:20px}
.class3 {font-size:10px;color:Gray}

And here is my RadEditor:

        <telerik:RadEditor ID="RadEditor1" Runat="server">
            <Tools>
                <telerik:EditorToolGroup>
                    <telerik:EditorTool Name="ApplyClass" />
                </telerik:EditorToolGroup>
            </Tools>
            <CssFiles>
                <telerik:EditorCssFile Value="StyleSheet.css" />
            </CssFiles>
            <CssClasses>
                <telerik:EditorCssClass Name="" Value="" />
                <telerik:EditorCssClass Name="Class one" Value=".class1" />
                <telerik:EditorCssClass Name="Class two" Value=".class2" />
            </CssClasses>
        </telerik:RadEditor>

As I understand things, the <CssClasses> node should restrict the control to only showing ".class1" and ".class2", and they should be aliased with the names "Class one" and "Class two" in the dropdown.  However, then I look at the dropdown that appears for the "ApplyClass" tool when I run the page, I still see all three styles, with their original names (class1, class2, and class3).

I have also tried this putting the <CssClasses> information in the ToolsFile.xml, as shown below, with the same results.  Here is the tools files I used:

<root>
  <tools>
    <tool name="FormatCodeBlock"/>
    <tool name="ApplyClass"/>
  </tools>
  <classes>
    <class name="Class one" value=".class1" />
    <class name="Class two" value=".class2" />
  </classes>

</root>

I noticed a similar post was made to the forum previously:

http://www.telerik.com/community/forums/aspnet-ajax/editor/rad-styles-showing-in-the-style-ddl.aspx

I downloaded the sample project and ran it  The referenced style sheet "EditorTestStylesheet.css" was missing from the download, so I just put the following classes in the Default.aspx page:

    <style>
        .FeatureTitle {text-align:center;}
        .StandardText {text-align:center;}
        .NewText {text-align:center;}
    </style>

Once again,  the ones listed in the <CssClasses> node of the RadEditor were not aliases, and the one that was in the CSS but not in the <CssClasses> node still appeared.  The screen shot from that forum post also shows that the css classes were not aliased.  

My question is: how do I restrict which classes in the CSS file appear in the ApplyClasses dropdown, and how do I alias them with user-friendly names?

I would appreciate any assistance you could give me in the matter.  Thank you so much for your help.

Joe

[Rumen]

Hi Joseph,

The CssClasses collection is not supported by version 2007.3.1425 and the earlier ones of RadEditor for ASP.NET AJAX. We added CssClasses support (same as RadEditor classic) in Q1 2008 (version 2008.1.415).
You should upgrade at least to Q1 2008 (2008.1.619) or the latest Q2 2009 to be able to restrict the styles inside the Apply Class dropdown using the CssClasses collection.

Greetings,
Rumen
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Joseph Alfano]

Thanks, Rumen, for the assistance in answering my question.