Blockquote for Indent, setting?

5 posts, 0 answers
  1. Amit
    Amit avatar
    4 posts
    Member since:
    Oct 2011

    Posted 25 Feb 2014 Link to this post

    Is it possible to indicate to RadEditor to use blockquotes for the indent (like it used to) instead of the new style-tag?
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 26 Feb 2014 in reply to Amit Link to this post

    Hi Amit,

    Please have a look into the following code snippet which works fine at my end.

    ASPX:
    <telerik:RadEditor ID="RadEditor1" runat="server" OnClientCommandExecuted="OnClientCommandExecuted">
    </telerik:RadEditor>

    JavaScript:
    <script type="text/javascript">
        function OnClientCommandExecuted(editor, args) {
            var commandName = args.get_commandName();
            var editorParentSelection = editor.getSelection().getParentElement();
            if (commandName == "Indent") {
                var selectedElement = editor.getSelectedElement();
                while (!Telerik.Web.UI.Editor.Utils.isEditorContentArea(selectedElement) && !(selectedElement.tagName.toLowerCase() == "blockquote")) {
                    selectedElement = selectedElement.parentNode;
                }
                var tempDiv = editor.get_document().createElement("blockquote");
                tempDiv.innerHTML = selectedElement.innerHTML;
                selectedElement.parentNode.replaceChild(tempDiv, selectedElement);
            }
        }
    </script>

    Thanks,
    Shinu.
  3. Amit
    Amit avatar
    4 posts
    Member since:
    Oct 2011

    Posted 26 Feb 2014 in reply to Shinu Link to this post

    WOW thanks for your help. I will have a programmer try this out asap and let you know the results.
  4. Amit
    Amit avatar
    4 posts
    Member since:
    Oct 2011

    Posted 27 Feb 2014 Link to this post

    We tried the supplied fix but didn't work correctly, so we modified it (below). HOWEVER, now the "out-dent"  button doesn't work to remove the indent/blockquote... would you be able to provide a starting point for that?

    here's the modified code. The above while indented the block in the GUI it indented ALL the text  not the element and teh <blockquote> was not found in the HTML.

     var commandName = args.get_commandName();
        var editorParentSelection = sender.getSelection().getParentElement();
        switch (commandName) {
            case "Indent":
                var selectedElement = sender.getSelectedElement();
                if (!Telerik.Web.UI.Editor.Utils.isEditorContentArea(selectedElement)) {
                    var tempDiv = sender.get_document().createElement("blockquote");
                    tempDiv.innerHTML = selectedElement.outerHTML;
                    selectedElement.parentNode.replaceChild(tempDiv, selectedElement);
                }
                break;
        }

    Again if you have any guidance on out-denting that would be great, or if you see any issue with the code as written here. Thanks!


  5. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 28 Feb 2014 in reply to Amit Link to this post

    Hi Amit,

    Please try the following JavaScript which works fine at my end.

    JavaScript:
    <script type="text/javascript">
        function OnClientCommandExecuted(sender, args) {
            var commandName = args.get_commandName();
            var selectedElement = sender.getSelectedElement();
            switch (commandName) {
                case "Indent":
                    if(!Telerik.Web.UI.Editor.Utils.isEditorContentArea(selectedElement)){
                        var tempDiv = sender.get_document().createElement("blockquote");
                        tempDiv.innerHTML = selectedElement.outerHTML;
                        selectedElement.parentNode.replaceChild(tempDiv,selectedElement);
                    }
                    break;
                case "Outdent":
                    selectedElement.parentNode.outerHTML =selectedElement.parentNode.innerHTML;
                    break;
            }
        }
    </script>

    Hope this will helps you.
    Thanks,
    Shinu.
Back to Top