Add image upload icon - lose functionality

[Amanda]

So, if you want to add and image upload icon - you lose the rest of the functionality of the radEditor?  How do I retain the other information in the menu of the radEditor yet add the ability to add images?

Thanks in advance.

[Marin Bratanov]

Hi Amanda,

You can add a button programmatically without deleting the whole toolbar by using this example method:

protected void Page_Load(object sender, EventArgs e)
    {
        //make sure that the main tools are already loaded before adding your own
        RadEditor1.EnsureToolsFileLoaded();

        EditorToolGroup toolgroup = new EditorToolGroup();
        RadEditor1.Tools.Add(toolgroup);
        EditorTool custom1 = new EditorTool();
        custom1.Name = "Custom1";
        custom1.ShortCut = "CTRL+1";
        toolgroup.Tools.Add(custom1);

    }

Note the call to the EnsureToolsFileLoaded() method. Without it you will lose the default toolbar.

Alternatively, you could copy the default toolsfile, modify it to your liking and set it as an external toolsfile.

How to add custom buttons and implement their functionality is explained in the documentation: http://www.telerik.com/help/aspnet-ajax/editor-adding-your-own-buttons.html

Greetings,
Marin
the Telerik team

[Amanda]

Thanks,  I have one more question.  After you save the radEditor - and you go back to edit it - how do you call it in the code behind to show what is already in the database?  I have tried radEdit.Text = dt.rows[0][""].ToString(); - that doesn't work though.  Thank you!

[Marin Bratanov]

Hi Amanda,

The Text property is read-only and returns the content as plain text (without the HTML tags). To set the current RadEditor content you can use its Content property, as it is read-write and supports HTML formatting. For example:

RadEditor1.Content = "Sample Content";

The approach when using RadEditor with databases is illustrated in the following demo: http://demos.telerik.com/aspnet-ajax/editor/examples/saveindatabase/defaultcs.aspx

Please note that RadEditor works primarily on the client, so you should specifically make sure to call the code-behind function that alters the content and reload the page so that the Editor gets your new content. For example:

protected void ChangeContent(object sender, EventArgs e)
{
    editor1.Content = "sample content";
}

Try using this function in the code-behind with these two versions of the aspx page:

<asp:ScriptManager runat="server"></asp:ScriptManager>
<telerik:RadEditor runat="server" ID="editor1"></telerik:RadEditor>
<asp:Button runat="server" ID="changer" Text="change content" OnClick="ChangeContent" />

and:

<asp:ScriptManager runat="server"></asp:ScriptManager>
<telerik:RadEditor runat="server" ID="editor1"></telerik:RadEditor>
<asp:Button runat="server" ID="changer" Text="change content" OnClick="ChangeContent"
         OnClientClick="javascript:void(0);return false;" />

Note that in the second version I forcefully cancel the postback and the new content is not set in the editor.


Best wishes,
Marin
the Telerik team

[Amanda]

Okay - so I have images imbedded into the text that have been saved in the database.  I am able to get the text out - but the images are not displaying because of the ToString() at the end of the call.  How can I get the images to show as well - this is what I have now.

radEdit.Content = dt.Rows[0]["News"].ToString();

[Marin Bratanov]

Hi Amanda,

You need to provide a valid HTML string for the Editor's Content property. In your case you need to parse your  data before you set it in the editor and replace the inline images with corresponding <img /> tags. How to do that depends on your custom database, its content and your scenario.


Regards,
Marin
the Telerik team

[Amanda]

When I am saving it - this is what is being saved:
<img alt=\"\" src=\"/Share_Images/1XXX_Web.JPG\" />

[Marin Bratanov]

Hi Amanda,

The string you have is not valid XHTML. You need to use the Replace() method and remove the escaping from the quotation marks before passing it to the Editor.


All the best,
Marin
the Telerik team