How to insert Image at Cursorposition in a RichTextEditor control?

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • Napsterr
    New Member
    • Sep 2010
    • 14

    How to insert Image at Cursorposition in a RichTextEditor control?

    I have a RichTextEditor control. I want to insert image whereever the cursor is. Onclicking Insert link i want to insert Image.
    Is it possible?

    I have this design in .aspx page.
    After clicking on lnkBtnInsert, I want to insert Image which user have uploaded using fileupload control.

    Code:
    <table border="0" cellpadding="0" cellspacing="0">
            <tr>
                <td>
                     <cc2:Editor ID="Editor1" runat="server" />
                </td>
            </tr>
            <tr>
                <td>
                    <asp:FileUpload runat="server" ID="fileUpload" />
                </td>
                <td>
                    <asp:Button ID="btnUpload" Text="Upload" runat="server" OnClick="btnUpload_Click" />
                </td>
            </tr>
            <tr>
                <td>
                    <asp:Label ID="lblImgPath" runat="server" />
                </td>
            </tr>
            <tr>
                <td>
                    <asp:LinkButton ID="lnkBtnInsert" Text="Insert" runat="server" 
                        onclick="lnkBtnInsert_Click" />
                </td>
            </tr>
        </table>
    Plz Help me...
    Thanx in advance
  • acoder
    Recognized Expert MVP
    • Nov 2006
    • 16032

    #2
    See this example - <img /> button.

    Comment

    • Napsterr
      New Member
      • Sep 2010
      • 14

      #3
      Thank You, acoder

      But I can't find solution from this example.
      See, I have....
      1. Fileupload control using which user uploads image to the server.
      2. Rich Text Editor control
      I want to insert the uploaded image in the Rich Text Editor control at cursor position.

      Comment

      • navdmk
        New Member
        • Jan 2011
        • 1

        #4
        If you are using TinyMCE, they have an inbuilt function:mceIns ertContent
        So you can try this-

        tinyMCE = parent.tinyMCE;

        function sendToEditor(im gsrc)
        {
        imgsrc1 = '<div align=\"center\ "><img src='+imgsrc+' border="0"></div>';
        parent.tinyMCE. execCommand('mc eInsertContent' , false, imgsrc1);
        }

        Comment

        Working...