Apply CSS class to a list with a single element

[Ivan]

Hello,

I have the following scenario:

1. insert the following html into the editor:

<ul>
 <li>test</li>
</ul>

2. switch to design view and try to apply any CSS class to the UL element

Result:
CSS is applied to li element

It works fine if list contains several elements and you apply CSS to all of them.

How this can be fixed?

[Rumen]

Hello,

You can try the following solution:

<script type="text/javascript">
    function OnClientCommandExecuting(editor, args) {
        var commandName = args.get_commandName();
        if (commandName == "ApplyClass" && $telerik.isIE) {
            var selElem = editor.getSelectedElement(); //get the selected element
            if (!selElem.previousSibling) return;
            if (selElem.previousSibling.tagName == "OL" || selElem.previousSibling.tagName == "UL") {
                editor.selectElement(selElem);
                selElem.className = args.get_value();
                args.set_cancel(true);
            }
        }
    }
</script>

<telerik:RadEditor runat="server" ID="RadEditor1" OnClientCommandExecuting="OnClientCommandExecuting">
     <Content>
         <ul>
             <li>List 1</li>
         </ul>
    </Content>
</telerik:RadEditor>

All the best,
Rumen
the Telerik team

[Ivan]

Hello,

The solution does not work (no changes), however if I modify the code like follows it seems to be working:

function OnClientCommandExecuting(editor, args) {
        var commandName = args.get_commandName();
        if (commandName == "ApplyClass" && $telerik.isIE) {
            var selElem = editor.getSelectedElement(); //get the selected element
            if (!selElem.parentElement) return;
            if (selElem.parentElement.tagName == "OL" || selElem.parentElement.tagName == "UL") {
                selElem =selElem.parentElement;
                editor.selectElement(selElem);
                selElem.className = args.get_value();
                args.set_cancel(true);
            }
        }
    }

Is this right way to do it?

[Rumen]

Hi,

Yes, your code update is fine and you can use it.

Best regards,
Rumen
the Telerik team