This is a migrated thread and some comments may be shown as answers.

Editor adds span tag to new lines

3 Answers 34 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Ivan
Top achievements
Rank 1
Ivan asked on 06 Aug 2015, 07:18 AM

Hello,

 

If you have a span tag at line 1 and press enter to create a new line it adds a span tag to a new line. See the video for details:

http://screencast.com/t/nseFoTTl

Is there a way to prevent this?

3 Answers, 1 is accepted

Sort by
0
Nikolay
Telerik team
answered on 06 Aug 2015, 11:23 AM
Hi,

Here is how you can modify the "EnterNewLine" command to prevent inserting formatting from the source element.
<telerik:RadEditor ID="radEditor1" runat="server" OnClientCommandExecuted="OnClientCommandExecuted">
</telerik:RadEditor>
 
<script type="text/javascript">
    function OnClientCommandExecuted(editor, args) {
        if (args.get_commandName() == "EnterNewLine") {
            var $Editor = Telerik.Web.UI.Editor;
            var range = $Editor.DomRange.toDomRange(editor.getSelection().getRange(true));
            var commonAncestorContainer = range.commonAncestorContainer;
            if (isCursorPlaceHolder(commonAncestorContainer) && $Editor.Utils.isSingleChild(commonAncestorContainer)) {
                var node = commonAncestorContainer.parentNode;
                while ($Editor.Utils.isSingleChild(node) && !$Editor.Utils.isBlockElement(node)) {
                    var current = node;
                    node = node.parentNode;
                    if (shouldRemoveNode(current)) {
                        $Editor.Utils.removeNode(current);
                    }
                }
                range.select();
            }
        }
    }
 
    function isCursorPlaceHolder(element) {
        return element.nodeType == 3 && /^[\u200b]+$/.test(element.nodeValue);
    }
 
    function shouldRemoveNode(node) {
        //You can modify this function according to the scenario
        return node.nodeName == "SPAN" || node.nodeName == "FONT";
        //return true;
    }
</script>

I have handled RadEditor's OnClientCommandExecuted event and for "EnterNewLine" command while the selection is in inline element without content, I am removing the parent element of the selected one.

Regards,
Nikolay
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Elena
Top achievements
Rank 1
answered on 07 Aug 2015, 10:37 AM

Hello,

Thank you for the reply. I tried to use the provided code.Unfortunately, I got the following error:
 "Uncaught TypeError: Cannot read property 'toDomRange' of undefined"
on the  line
var range = $Editor.DomRange.toDomRange(editor.getSelection().getRange(true));.
The Telerik version is 2012.2.607.35.
Can you help?

Best regards, 
Elena

0
Elena
Top achievements
Rank 1
answered on 10 Aug 2015, 10:14 AM

Hello,

I have tested the code with the new Telerik version 2015.2.729.45. It works correctly.

Thank you for help.

Best regards, 
Elena‚Äč

Tags
Editor
Asked by
Ivan
Top achievements
Rank 1
Answers by
Nikolay
Telerik team
Elena
Top achievements
Rank 1
Share this question
or