+1-888-365-2779
Try Now
More in this section

Forums / Bugs & Issues / RadEditor with image manager

RadEditor with image manager

1 posts, 0 answered
  1. Luyen Minh
    Luyen Minh avatar
    9 posts
    Registered:
    27 Oct 2014
    09 Dec 2014
    Link to this post

    Hi All.

    I have created a control using RadEditor and image manager (follow link: http://www.sitefinity.com/developer-network/forums/developing-with-sitefinity/radeditor-image-manager).

    When user click button "Insert an image" it show "ImageLibraryDialog" and user can select an image as image-1.

    My problem is: How to append selected image  to radEditor control when click button save in "ImageLibraryDialog".

    Here is my code in .ascx designer:

     

     <telerik:RadEditor ID="HtmlSocial" runat="server" Width="600px"  ClientIDMode="Static" OnClientLoad="OnClientLoad"
                    ToolsFile="~/Extensions/RadEditor/ToolsFile.xml"
                    ContentFilters="EncodeScripts,FixUlBoldItalic,FixEnclosingP,IECleanAnchors,MozEmStrong,ConvertFontToSpan,ConvertToXhtml,IndentHTMLContent"
                    >
                    <ImageManager ViewPaths="~/Images" UploadPaths="~/Images" DeletePaths="~/Images" />
                    <MediaManager ViewPaths="~/Files" UploadPaths="~/Files" DeletePaths="~/Files" />
                    <FlashManager ViewPaths="~/Files" UploadPaths="~/Files" DeletePaths="~/Files" />
                    <DocumentManager ViewPaths="~/Files" UploadPaths="~/Files" DeletePaths="~/Files" />
                    <Content>
                    </Content>
                </telerik:RadEditor>

     

    And here is the script to open image library dialog:

     

    <script type="text/javascript">

     

        Telerik.Web.UI.Editor.CommandList["LibraryImageManager"] = function (commandName, editor, args) {
            var editorArgs = editor.getSelectedElement();
            //if (!editorArgs || !editorArgs.nodeName || typeof (editorArgs.nodeName) == "undefined" || editorArgs.nodeName != "A")
            //    editorArgs = editor.getSelection();

            var myCallbackFunction = function (sender, args) {
                alert(1);
                debugger;
                if (typeof(editorArgs.nodeName) != "undefined" && editorArgs.nodeName == "IMG")
                    args.parentNode.replaceChild(editorArgs, args);
                else {
                   // InsertTextArea();
                    var cloned = args.cloneNode(true);
                    var div = args.ownerDocument.createElement("DIV");
                    div.appendChild(cloned);
                    editorArgs.pasteHtml(div.innerHTML);
                   
                }
            };
            editor.showExternalDialog(
                '<%= ResolveUrl("~/Sitefinity/Dialog/MediaContentManagerDialog/?mode=Image")%>',
                editorArgs,
                750,
                600,
                myCallbackFunction,
                null,
                'ImageLibraryDialog',
                true,
                Telerik.Web.UI.WindowBehaviors.Close + Telerik.Web.UI.WindowBehaviors.Move,
                false,
                true);
        };
        function InsertTextArea() {
            var editor = $find('<%=HtmlSocial.ClientID%>');
            editor.set_html('<textarea id="myTableToFind" style="overflow:hidden; height: 300px; width: 500px;" border="none"></textarea>');
        }

                    </script>

    - When user click button save in image-1: I have an error: Uncaught TypeError: undefined is not a function (please see: Image-2) 

     

     Please tell me how to append selected image  to radEditor control when click button save in "ImageLibraryDialog".

     

    Thanks you very much.

     

     

1 posts, 0 answered