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));
}
}