Editor adds span tag to new lines

4 posts, 0 answers
  1. Ivan
    Ivan avatar
    16 posts
    Member since:
    Oct 2011

    Posted 06 Aug 2015 Link to this post

    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?

  2. Nikolay
    Admin
    Nikolay avatar
    64 posts

    Posted 06 Aug 2015 Link to this post

    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
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Elena
    Elena avatar
    2 posts
    Member since:
    Aug 2015

    Posted 07 Aug 2015 in reply to Nikolay Link to this post

    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

  5. Elena
    Elena avatar
    2 posts
    Member since:
    Aug 2015

    Posted 10 Aug 2015 Link to this post

    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​

Back to Top