I have a telerik RadEditor used in a User control. I can upload images, select images, view images through ImageManager, but I cannot insert the Image to the content area.
I tried put same code in regular Aspx page, it has no problem to insert picture to the content area.
Could anyone help me how to get the insert image function work if the RadEditor is used in a user control?
11 Answers, 1 is accepted
Could you please send me the HTML code, which you are setting to the Editor's Content property? I will review it and advise you further.
Regards,
Stanimir
Telerik
Rank 1
Satnimir,
This is my usercontrol markup file.
//GPageContentManagement.ascx
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="GPageContentManagement.ascx.cs" Inherits="Controls_Admin_UndergratuateOppManagement" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<div id="tblMain" runat="server" width="100%" style="margin-left: 10px; margin-right: 10px; margin-bottom:10px;">
<div class="manageSubTitle">
General Page Content Management
</div>
<div style="padding-left:40px">
<b>Select a page:</b><br />
<telerik:RadComboBox ID="rcbPage" runat="server" Width="250px" DropDownWidth="250px" AutoPostBack="true" OnSelectedIndexChanged="rcbPage_SelectedIndexChanged"></telerik:RadComboBox>
</div>
<div style="margin-left: 40px; margin-top:20px; margin-right:40px">
<div>
<telerik:RadEditor ID="rEditPageContent" runat="server" EditModes="All" NewLineBr="true" ToolbarMode="Default" ContentFilters="FixEnclosingP" width="100%" Height="500px">
<ImageManager EnableAsyncUpload="true" DeletePaths="~/GeneralPageImages/" ViewPaths="~/GeneralPageImages/" UploadPaths="~/GeneralPageImages/"
MaxUploadFileSize="16000000" ViewMode="Thumbnails" />
<Content></Content>
</telerik:RadEditor>
<%-- <script type="text/javascript">
Telerik.Web.UI.Editor.RemoveExtraBrakes.prototype.getHtmlContent = function (content) {
return content;
}
Telerik.Web.UI.Editor.StripJunkFilter.prototype.getHtmlContent = function (content) {
return content;
}
</script>--%>
</div>
<div class="divButton">
<telerik:RadButton ID="rbtnSaveContent" runat="server" Text="Save" Width="150px" OnClick="rbtnSaveContent_Click"></telerik:RadButton>
<telerik:RadButton ID="rbtnCancel" runat="server" Text="Cancel" Width="150px" OnClick="rbtnCancel_Click"></telerik:RadButton>
<br />
<asp:Label ID="saveMsg" runat="server" CssClass="Msg" Visible="false"></asp:Label>
<br />
</div>
</div>
</div>
​
Rank 1
//GPageContentManagement.ascx.cs
using System.Drawing;
using System.Drawing.Imaging;
using System.Configuration;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls.WebParts;
public partial class Controls_Admin_UndergratuateOppManagement : System.Web.UI.UserControl
{
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
PopulateControls();
}
//rEditPageContent.ImageManager.ContentProviderTypeName = typeof(Telerik.Web.UI.Widgets.FileBrowserContentProvider).AssemblyQualifiedName;
saveMsg.Visible = false;
}
private void PopulateControls()
{
rcbPage.DataSource = GeneralPageContents.Find(Int32.MinValue, String.Empty);
rcbPage.DataTextField = "PageName";
rcbPage.DataValueField = "ID";
rcbPage.DataBind();
rcbPage.SelectedIndex = 0;
SetContentImageManager();
}
private void SetContentImageManager()
{
Int32 pageID = Functions.FormatPotentialNullInt(rcbPage.SelectedValue);
Tepper.Data.CBDR.GeneralPageContent pageContent = Tepper.CBDR.GeneralPageContents.GetPageContent(pageID, string.Empty);
if (pageContent != null)
rEditPageContent.Content = pageContent.PageContent.ToString();
else
rEditPageContent.Content = "";
string imageDir = Application["GeneralPageImages"].ToString();
if (imageDir.Length > 0)
{
if (!Directory.Exists(MapPath(imageDir)))
{
Directory.CreateDirectory(MapPath(imageDir));
}
}
}
protected void rbtnSaveContent_Click(object sender, EventArgs e)
{
Int32 pageID = Functions.FormatPotentialNullInt(rcbPage.SelectedValue);
Tepper.Data.CBDR.GeneralPageContent pageContent = Tepper.CBDR.GeneralPageContents.GetPageContent(pageID, string.Empty);
int rowsAffected = -1;
if (pageContent != null)
{
pageContent.PageContent = rEditPageContent.Content;
rowsAffected = pageContent.Update();
}
saveMsg.Visible = true;
if (rowsAffected > 0)
saveMsg.Text = "Content for " + rcbPage.SelectedItem.Text + " is successfully saved.";
else
saveMsg.Text = "Content is not saved.";
}
protected void rbtnCancel_Click(object sender, EventArgs e)
{
Int32 pageID = Functions.FormatPotentialNullInt(rcbPage.SelectedValue);
Tepper.Data.CBDR.GeneralPageContent pageContent = Tepper.CBDR.GeneralPageContents.GetPageContent(pageID, string.Empty);
if (pageContent != null)
rEditPageContent.Content = pageContent.PageContent.ToString();
else
rEditPageContent.Content = "";
}
protected void rcbPage_SelectedIndexChanged(object sender, RadComboBoxSelectedIndexChangedEventArgs e)
{
SetContentImageManager();
}
}​
Rank 1
The User control are used in this aspx file:
<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="SiteManagement.aspx.cs" Inherits="Tepper.CBDR.UI.SiteManagement" %>
<%@ Register Src="~/Controls/Admin/LinksManagement.ascx" TagName="LinksManagement" TagPrefix="LinksManage" %>
<%@ Register Src="~/Controls/Admin/PeopleManagement.ascx" TagName="PeopleManagement" TagPrefix="PeopleManage" %>
<%@ Register Src="~/Controls/Admin/ParticipantManagement.ascx" TagName="ParticipantManagement" TagPrefix="ParticipantManage" %>
<%@ Register Src="~/Controls/Admin/SeminarsManagement.ascx" TagName="SeminarsManagement" TagPrefix="SeminarsManage" %>
<%@ Register Src="~/Controls/Admin/HomeManagement.ascx" TagName="HomeManagement" TagPrefix="HomeManage" %>
<%@ Register Src="~/Controls/Admin/AffiliationManagement.ascx" TagName="AffiliationManagement" TagPrefix="AffiliationManage" %>
<%@ Register Src="~/Controls/Admin/GPageContentManagement.ascx" TagName="GPageContentManagement" TagPrefix="GPageContentManage" %>
<%@ Register Src="~/Controls/Admin/InfoResearchManagement.ascx" TagName="InfoResearchManagement" TagPrefix="InfoResearchManage" %>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="btnAddRole">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="rlbRoles" />
<telerik:AjaxUpdatedControl ControlID="rcbRole" />
</UpdatedControls>
</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="rcbPerson">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="rtbFirstName" />
<telerik:AjaxUpdatedControl ControlID="rtbLastName" />
<telerik:AjaxUpdatedControl ControlID="rcbAffiliation" />
<telerik:AjaxUpdatedControl ControlID="rtbEmail" />
<telerik:AjaxUpdatedControl ControlID="rtbWebLink" />
<telerik:AjaxUpdatedControl ControlID="cbPeoplePage" />
<telerik:AjaxUpdatedControl ControlID="rlbRoles" />
<telerik:AjaxUpdatedControl ControlID="lblMessage" />
</UpdatedControls>
</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="btnClearPerson">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="rtbFirstName" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rtbLastName" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rcbAffiliation" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rtbEmail" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rtbPassword" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rtbConfirmPassword" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rtbWebLink" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="cbPeoplePage" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rlbRoles" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="lblMessage" UpdatePanelRenderMode="Inline" />
</UpdatedControls>
</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="btnSavePerson">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="rtbFirstName" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rfvFirstName" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rtbLastName" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rfvLastName" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rcbAffiliation" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rfvAffiliation" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rtbEmail" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="emailValidator" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rfvEmail" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rtbPassword" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rtbConfirmPassword" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="cvPassword" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rlbRoles" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rfvRoles" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="rcbPerson" UpdatePanelRenderMode="Inline" />
<telerik:AjaxUpdatedControl ControlID="lblMessage" UpdatePanelRenderMode="Inline" />
</UpdatedControls>
</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="rEditPageContent">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="rEditPageContent" LoadingPanelID="RadAjaxLodingPanel1"/>
</UpdatedControls>
</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="ctrlGPageContentManage">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="ctrlGPageContentManage" LoadingPanelID="RadAjaxLodingPanel1"/>
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" />
<div>
<telerik:RadTabStrip ID="rtsSiteManagement" runat="server" Width="100%" SelectedIndex="0" MultiPageID="rmpSiteManagement" Visible="false" OnTabClick="rtsSiteManagement_TabClick">
<Tabs>
<telerik:RadTab runat="server" PageViewID="rpvHome" Text="Home" Value="0">
</telerik:RadTab>
<telerik:RadTab runat="server" PageViewID="rpvLinks" Text="Links" Value="1">
</telerik:RadTab>
<telerik:RadTab runat="server" PageViewID="rpvPeople" Text="People" Value="2">
</telerik:RadTab>
<telerik:RadTab runat="server" PageViewID="rpvExperimentSignups" Text="Participant Signups" Value="3">
</telerik:RadTab>
<telerik:RadTab runat="server" PageViewID="rpvSeminars" Text="Seminars" Value="4">
</telerik:RadTab>
<telerik:RadTab runat="server" PageViewID="rpvAffiliations" Text="Affiliations" Value="5">
</telerik:RadTab>
<telerik:RadTab runat="server" PageViewID="rpvGPageContent" Text="General Page Contents" Value="6">
</telerik:RadTab>
<telerik:RadTab runat="server" PageViewID="rpvInfoReseachers" Text="Info For Researchers" Value="7">
</telerik:RadTab>
</Tabs>
</telerik:RadTabStrip>
<telerik:RadMultiPage ID="rmpSiteManagement" runat="server" Width="100%" SelectedIndex="0" BorderStyle="Solid" BorderWidth="1" Visible="false">
<telerik:RadPageView ID="rpvHome" runat="server">
<table style="width: 100%; border: solid 1px lightgrey;">
<tr>
<td style="width: 100%">
<HomeManage:HomeManagement ID="HomePageManagement" runat="server" />
</td>
</tr>
</table>
</telerik:RadPageView>
<telerik:RadPageView ID="rpvLinks" runat="server">
<table style="width: 100%; border: solid 1px lightgrey;">
<tr>
<td style="width: 100%">
<LinksManage:LinksManagement ID="ctrlLinksManage" runat="server" />
</td>
</tr>
</table>
</telerik:RadPageView>
<telerik:RadPageView ID="rpvPeople" runat="server">
<table style="width: 100%; border: solid 1px lightgrey;">
<tr>
<td style="width: 100%">
<PeopleManage:PeopleManagement ID="ctrlPeopleManage" runat="server" />
</td>
</tr>
</table>
</telerik:RadPageView>
<telerik:RadPageView ID="rpvExperimentSignups" runat="server">
<table style="width: 100%; border: solid 1px lightgrey;">
<tr>
<td style="width: 100%">
<ParticipantManage:ParticipantManagement ID="ctrlParticipantManage" runat="server" />
</td>
</tr>
</table>
</telerik:RadPageView>
<telerik:RadPageView ID="rpvSeminars" runat="server">
<table style="width: 100%; border: solid 1px lightgrey;">
<tr>
<td style="width: 100%">
<SeminarsManage:SeminarsManagement ID="ctrlSeminarsManage" runat="server" />
</td>
</tr>
</table>
</telerik:RadPageView>
<telerik:RadPageView ID="rpvAffiliations" runat="server">
<table style="width: 100%; border: solid 1px lightgrey;">
<tr>
<td style="width: 100%">
<AffiliationManage:AffiliationManagement ID="ctrlAffiliationsManage" runat="server" />
</td>
</tr>
</table>
</telerik:RadPageView>
<telerik:RadPageView ID="rpvGPageContent" runat="server">
<table style="width: 100%; border: solid 1px lightgrey;">
<tr>
<td style="width: 100%">
<GPageContentManage:GPageContentManagement ID="ctrlGPageContentManage" runat="server" />
</td>
</tr>
</table>
</telerik:RadPageView>
<telerik:RadPageView ID="rpvInfoReseachers" runat="server">
<table style="width: 100%; border: solid 1px lightgrey;">
<tr>
<td style="width: 100%">
<InfoResearchManage:InfoResearchManagement ID="ctrlInfoResearchManage" runat="server" />
</td>
</tr>
</table>
</telerik:RadPageView>
</telerik:RadMultiPage>
</div>
</asp:Content>
​
As far as I understand you can open the ImageManager dialog but when you hit the Insert button the image does not appear in the content area. Could you confirm that this is your problem?
If this is the problem, could you check if there are javascript errors in the page. Such errors might prevent the image from appearing. Also you can check the image's src property. Is the path to the image accessible from the page where you are loading the control (this is in case it is relative)?
In addition could you send me a sample content which is made by the editor after the problem occurs?
Regards,
Stanimir
Telerik
Rank 1
Yes, you are right. I can open the ImageManage, upload images, select image, just cannot insert the image to the content area. After hit the insert button, I also looked at the HTML in the content area, no src was created.
I had javascript originally, but I test it by commenting the javascript out, it still not work. The pass is accessible. I put the same code in a stand along aspx file, it works.
This problem occurs with any content, even one word content or without any word in the content.
I am still not able to reproduce the issue. Can you confirm that you are using the latest version of Telerik UI for ASP.NET AJAX. Currently it is 2015.2.729. Also I suggest you to isolate the problem in a simple runnable sample project and provide it to me in an official support ticket. This way I can reproduce the problem locally, debug it and advise you further.
Regards,
Stanimir
Telerik
Rank 1
Stanimir,
I have built a stand alone project. How could I create a official support ticket and submit my project to telerik?
Thank you,
Xiaobo
You can send official support tickets to Telerik support from your account by purchasing a valid license for the corresponding product. Further details: The support system assigns a response time for all of your questions, depending on your license and ensures that all questions will reach the respective developers, if needed.
Regards,
Ianko
Telerik
Rank 1
Hello Greg,
We will need a problem reproduction project that we can test. Could you please isolate the issue and send it for examination on our end via a support ticket?
Best regards,Rumen
Telerik by Progress