Hi,
I'm using a subclassed RadHtmlField field control on page layouts in a SharePoint 2013 environment to include the editor. Most of what I need works except for the following:
1. When I toggle to the full screen mode, selecting the 'Insert Link' option opens up the 'Select an Asset' SharePoint dialog. This all works fine, but when a selection is made & the dialog closes, the underlying RadEditor goes back to normal mode with the toggle full screen button depressed. This causes the page to sort of freeze until the full screen toggle button is raised again.
2. I add content such as this:
<div>
<div class="tile tile-image-top-left">
<div data-collapse="mobile" data-collapse-default="close">
<button data-collapse="control" data-desktop="exclude">Top Left</button>
<div data-collapse="content">
<div class="tile-image">
<img alt="Top Left" src="images/icon-tile-dummy-image.png" />
</div>
<div class="tile-title tile-title-background">
<p>Top Left</p>
</div>
<div class="tile-description">
<p>This demonstrates how a tile can be used for diplaying an image on the top left of the container. Any text around the tile image will wrap around the image associated with the tile.</p>
<p>Additionally, the tile can contain HTML content including hyperlinks and other images if required.</p>
<p><ul><li><a href="#">Browse to website 1</a></li></ul></p>
</div>
</div>
</div>
</div>
</div>
But the editor removes the <button> element.
Here are the contents of the files that you might find useful:
Sub-classed class
public class CustomRadHtmlField : Telerik.SharePoint.FieldEditor.RadHtmlField
{
#region Protected Methods
protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
ConfigureRadHtmlField();
}
protected override bool AllowFirstFocus { get { return false; } }
#endregion
#region Internal Methods
internal static void ConfigureRadEditorControl(ref SPRadEditor editor)
{
editor.ConfigFile = "/_layouts/15/divportals/telerik/configfile.xml";
editor.ToolsFile = "/_layouts/15/divportals/telerik/toolsfile.xml";
editor.EnsureToolsFileLoaded();
editor.ContentAreaMode = EditorContentAreaMode.Iframe;
editor.EnableFilter(EditorFilters.ConvertTags );
editor.DisableFilter(EditorFilters.EncodeScripts | EditorFilters.RemoveScripts);
editor.EditModes = EditModes.All;
editor.ToolbarMode = EditorToolbarMode.RibbonBarPageTop;
editor.NewLineMode = EditorNewLineModes.Div;
editor.ContextMenus.Clear();
editor.EnableEmbeddedScripts = true;
editor.EnableEmbeddedSkins = true;
}
#endregion
#region Private Methods
private void ConfigureRadHtmlField()
{
this.AllowScripts = false;
this.AllowSpecialTags = false;
this.AllowFonts = false;
CustomRadHtmlField.ConfigureRadEditorControl(ref this.radEditorControl);
}
#endregion
}
ConfigFile.xml
<configuration>
<property name="Skin">Default</property>
<property name="ToolbarMode">Default</property>
<property name="ContentAreaMode">IFRAME</property>
<property name="DocumentsFilters">
<item>*.*</item>
</property>
<property name="OnClientLoad">setAutoWidthForRadEditorControls</property>
<property name="ImagesPaths">
<item>SiteCollectionImages</item>
</property>
<property name="MaxDocumentSize">524288000</property>
<property name="MaxImageSize">524288000</property>
<property name="MaxFlashSize">524288000</property>
<property name="MaxMediaSize">524288000</property>
<property name="MaxSilverlightSize">524288000</property>
<property name="StripFormattingOptions">MSWordRemoveAll,Css,Font</property>
</configuration>
setAutoWidthForRadEditorControls JavaScript function
function setAutoWidthForRadEditorControls() {
// Set max width for all rad editor controls that appear in the main content place holder
var radEditorControl = $(".radEditorControl");
if (radEditorControl) {
radEditorControl.find(".reContentArea").width(Math.ceil(radEditorControl.width() * 0.98));
}
}