RadEditor removes script contents

Posted by Community Admin on 08-Mar-2011 00:00

Hi,

I'm trying to override the Content Editor usined in sitefinity by defining an external template. I'm using the RadEditor in the external template and I have mapped that with the HtmlField. Everything works as I expected but when I type in some script contents and after when i the mode to HTML/Preview it automatically clears the script content I typed in.

I've alreadt set the "AllowScripts" property to TRUE and but still couldnt get it working to accept script tags. How do I make the editor to accept script contents?

Thanks,
Duneel

Posted by Community Admin on 09-Mar-2011 00:00

Hello Duneel,

Thank you for contacting Telerik Support.

The " AllowScripts" property is very old now and not used and by default HtmlField does not allow usage of any scripts. Today we use a variety of Content Filters which you see here:

demos.telerik.com/.../defaultcs.aspx

As you can see, in your case you will have to disable is the RemoveScripts filter.

This can be achieved by entering the following code between <div>, </div> tags of your templates main .ascx file :

Copy Code

EditorContentFilters="DefaultScripts"

Replace DefaultScripts with the names of those filters you want to include in your project. Also if you want to have flawless working code use Script Widgets instead of Content Block for your scripts.

I will be happy to assist you if you have further questions.

All the best,
Victor Velev
the Telerik team

Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!

Posted by Community Admin on 10-Mar-2011 00:00

Hi Victor,

It seems the issue is happenning only in IE (my version is IE 8). I tried with Firefox and it saved the embed code properly in SF.

Following is the code I'm trying to paste on the editor. If I switch from HTML to Design, my pasted code is gone. Any idea why and is there an IE specific fix for this issue?

<object id="myExperience" class="BrightcoveExperience">

<param name="bgcolor" value="#FFFFFF" />

<param name="width" value="300" />

<param name="height" value="540" />

<param name="playerID" value="XXXXX" />

<param name="publisherID" value="XXXXX"/>

<param name="isVid" value="true" />

<param name="isUI" value="true" />

</object>

This is the code of my exteranl template containing the Radeditor. I found a fix for the IE script issue and I couldnt get it to work with this. You can see that part of oce is commented in the BrightcoveCallbackFunction.

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sf" %>

<style type="text/css">

.reToolbar .Brightcove

background: Transparent url('/ExtendedContentEditor/Images/brightcove.gif') no-repeat;

width: 18px;

height: 18px;

line-height: 16px;

</style>

<sf:ConditionalTemplateContainer ID="conditionalTemplate" runat="server">

<Templates>

<sf:ConditionalTemplate ID="ConditionalTemplate1" Left="DisplayMode" Operator="Equal" Right="Read" runat="server">

<sf:SitefinityLabel id="titleLabelRead" runat="server" WrapperTagName="div" HideIfNoText="false" CssClass="sfTxtLbl" />

<sf:SitefinityLabel id="viewControl" runat="server" WrapperTagName="div" HideIfNoText="false" CssClass="sfRTFContent" />

</sf:ConditionalTemplate>

<sf:ConditionalTemplate ID="ConditionalTemplate2" Left="DisplayMode" Operator="Equal" Right="Write" runat="server">

<sf:ResourceLinks id="resourcesLinks2" runat="server">

<sf:EmbeddedResourcePropertySetter Name="Telerik.Sitefinity.Resources.Themes.Default.Styles.EditorDialogs.css" Static="true" ControlID="editControl" ControlPropertyName="DialogsCssFile" />

<sf:ResourceFile Name="Telerik.Sitefinity.Resources.Themes.Default.Styles.Window.css" Static="true" />

</sf:ResourceLinks>

<asp:Label ID="titleLabel" runat="server" CssClass="sfTxtLbl" AssociatedControlID="editControl" />

<asp:LinkButton ID="expandLink" runat="server" OnClientClick="return false;" CssClass="sfOptionalExpander" />

<asp:Panel ID="expandableTarget" runat="server" CssClass="sfEditorWrp sfClearfix">

<telerik:RadEditor

AllowScripts="true"

ID="editControl"

runat="server"

Skin="Sitefinity"

Width="100%"

Height="550px"

EnableResize="False"

EditModes="Design,HTML"

DialogHandlerUrl="~/Telerik.Web.UI.DialogHandler.axd"

Content=""

NewLineBr="False"

StripFormattingOptions="Css,Font,Span"

OnClientLoad="Telerik$Sitefinity$Web$UI$Fields$HtmlField$radEditorToggleAdvancedToolbars"

OnClientPasteHtml="OnClientPasteHtml"

OnClientCommandExecuting="OnClientCommandExecuting">

<FlashManager ViewPaths="~/Files" UploadPaths="~/Files" DeletePaths="~/Files" />

</telerik:RadEditor>

<sf:SitefinityLabel id="descriptionLabel" runat="server" WrapperTagName="div" HideIfNoText="true" CssClass="sfDescription" />

<sf:SitefinityLabel id="exampleLabel" runat="server" WrapperTagName="div" HideIfNoText="true" CssClass="sfExample" />

</asp:Panel>

<script type="text/javascript">

var className = null;

var toRemove = false;

var handlersAdded = false;

function OnClientPasteHtml(sender, args)

var newContent = args.get_value();

newContent = newContent.replace(new RegExp("<b(\\s([^>])*?)?>", "ig"), "<strong$1>");

newContent = newContent.replace(new RegExp("</b(\\s([^>])*?)?>", "ig"), "</strong$1>");

newContent = newContent.replace(new RegExp("<i(\\s([^>])*?)?>", "ig"), "<em$1>");

newContent = newContent.replace(new RegExp("</i(\\s([^>])*?)?>", "ig"), "</em$1>");

var regex = /<([a-zA-Z]+) ?[^>]*?>\s*<\/\1>/gi;

newContent = newContent.replace(regex, "");

newContent = newContent.replace(new RegExp("( \s*\n*)+", "ig"), " ");

newContent = newContent.replace(new RegExp("(\s*\n*<br\s*\/?>\s*\n*)+", "ig"), "<br />");

args.set_value(newContent);

function OnClientCommandExecuting(editor, args)

var name = args.get_name();

var val = args.get_value();

var commandName = args.get_commandName();

className = "re" + commandName;

if (editor.get_dialogOpener())

if (editor.get_dialogOpener()._container && !handlersAdded)

editor.get_dialogOpener()._container.add_show(AddRemoveCSSClass);

editor.get_dialogOpener()._container.add_close(AddRemoveCSSClass);

handlersAdded = true;

if (name == "MergeTags")

editor.pasteHtml(val);

//Cancel the further execution of the command as such a command does not exist in the editor command list

args.set_cancel(true);

if (commandName == "ToggleScreenMode")

var containerWnd = GetRadWindow();

if (!editor.isFullScreen()) //if the editor is placed in fullscreen mode specify the needed content area width

$(editor.get_element()).addClass("sfFullScreenEditor");

if (containerWnd != null && !containerWnd.isMaximized())

containerWnd.maximize();

$(containerWnd.get_element()).addClass("sfWndToBeRestored");

editor.get_document().body.style.maxWidth = "640px";

else

$(editor.get_element()).removeClass("sfFullScreenEditor");

if (containerWnd != null && $(containerWnd.get_element()).hasClass("sfWndToBeRestored"))

$(containerWnd.get_element()).removeClass("sfWndToBeRestored");

containerWnd.restore();

editor.get_document().body.style.maxWidth = "100%";

if (commandName == "Brightcove")

//debugger;

function AddRemoveCSSClass(sender, args)

var popupElement = sender.get_popupElement();

if (!toRemove)

Sys.UI.DomElement.addCssClass(popupElement, className);

else

Sys.UI.DomElement.removeCssClass(popupElement, className);

function GetRadWindow()

var oWindow = null;

if (window.radWindow) oWindow = window.radWindow;

else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow;

return oWindow;

// Brightcove settings dialog START.

Telerik.Web.UI.Editor.CommandList["Brightcove"] = function (commandName, editor, args)

var editorArgs = editor.getSelectedElement();

if (!editorArgs.nodeName || typeof (editorArgs.nodeName) == "undefined" || editorArgs.nodeName != "A")

editorArgs = editor.getSelection();

var BrightcoveCallbackFunction = function (sender, args)

var playerID = args[0];

var publisherID = args[1];

var allignment = args[2];

var width = args[3];

var height = args[4];

var divStart = null;

if (allignment == "Left")

divStart = "<div style=\"float:left;\">";

else

divStart = "<div style=\"float:right;\">";

var embedStr = String.format("<object id=\"myExperience\" class=\"BrightcoveExperience\"><param name=\"bgcolor\" value=\"#FFFFFF\" /><param name=\"width\" value=\"2\" /><param name=\"height\" value=\"3\" /><param name=\"playerID\" value=\"0\" /><param name=\"publisherID\" value=\"1\"/><param name=\"isVid\" value=\"true\" /><param name=\"isUI\" value=\"true\" /></object>", playerID, publisherID, width, height);

embedStr = divStart + embedStr + "</div>";

/*

var filterIE = editor._filtersManager.getFilterByName("IEKeepObjectParamsFilter");

var filterMozz = editor._filtersManager.getFilterByName("MozillaKeepFlashString");

var html = (filterIE) ? filterIE.getDesignContent(embedStr) : embedStr;

html = (filterMozz) ? filterMozz.getDesignContent(html) : html;

editor.pasteHtml(html, "Insert Flash");

*/

editor.pasteHtml(embedStr);

editor.showExternalDialog('<%= Page.ResolveUrl("~/ExtendedContentEditor/Dialogs/InsertBrightcoveVideoDialog.aspx") %>',

editorArgs,

380,

BrightcoveCallbackFunction,

null,

'BrightcoveSettingsDialog',

true,

Telerik.Web.UI.WindowBehaviors.Close + Telerik.Web.UI.WindowBehaviors.Move,

false,

true)

;

// Brightcove settings dialog END.

</script>

</sf:ConditionalTemplate>

</Templates>

</sf:ConditionalTemplateContainer>

Thanks,
Duneel

Posted by Community Admin on 14-Mar-2011 00:00

Hello Duneel,

Thank you for getting back to me.

I have tried to replicate the problem locally by copying the code you provided and registering it in the backend as

Telerik.Sitefinity.Web.UI.Fields.HtmlField

and it seems Internet Explorer 8 cleans not valid html code. When I inserted your code it disappeared but when creating a simple script using proper html, it displayed and functioned the way it should.

Greetings,
Victor Velev
the Telerik team

Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!

Posted by Community Admin on 14-Mar-2011 00:00

Hi Victor,

The script code I'm trying to save is to embed the Brightcove player. For some reason the IE doesnt like the <param></param> and automatically strips-off when entered in the RadEditor. Is there a fix to force to accept such scripts in IE?

Thanks,
Duneel

Posted by Community Admin on 16-Mar-2011 00:00

Hello Duneel,

After close look at your code looks like the problem is coming from the closing tag of the <param value>.
The following code is working perfectly ( with few minor additions ):

<object width="150" height="150" class="BrightcoveExperience" id="myExperience" classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000">

<param name="bgcolor" value="#FFFFFF"/>

<param name="width" value="300"/>

<param name="height" value="540"/>

<param name="playerID" value="XXXXX"/>

<param name="publisherID" value="XXXXX"/>

<param name="isVid" value="true"/>

<param name="isUI" value="true"/>

</object>

Lets compare it to your code:

<object id="myExperience" class="BrightcoveExperience">

<param name="bgcolor" value="#FFFFFF">

<param name="width" value="300">

<param name="height" value="540">

<param name="playerID" value="XXXXX">

<param name="publisherID" value="XXXXX">

<param name="isVid" value="true">

<param name="isUI" value="true">

</object>

As you can see the correct tag is:

<param name="bgcolor" value="#FFFFFF"/>

instead of

<param name="bgcolor" value="#FFFFFF">

With the param value closed properly the script works properly on Internet Explorer as well as the other browsers.

Greetings,
Victor Velev
the Telerik team

Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!

Posted by Community Admin on 21-Mar-2011 00:00

Hi Victor,

The code I sent you has the proper closing tags for the <param> elements. But it's still stripping off. I'm tring to embed this script in news items. The only difference in the code sample you sent me contains some new properties in <object></object> element.

Thanks!
Duneel

Posted by Community Admin on 21-Mar-2011 00:00

Hi Duneel,

You need the class id which is in the <object> tag. It represents a unique id for a software application or application component which in your case is Flash for the player you want to install on your page. Without it, your code is not recognized and interpreted properly.

Regards,
Victor Velev
the Telerik team

Vote for the 7 Telerik products at the 2011 Great Indian Developer Awards!

Posted by Community Admin on 31-Jul-2015 00:00

Hi guys i'm also getting same issue while adding <form> </form> tag in MOSSRadEditor htmlmode getting alert undefined and it clear all data .. please let me know how to fix this

This thread is closed

All Replies