Inline Javascript in Generic Content
Hello,
We are using Sitefinity 4.2 in our website, and we need to have a shared generic content that contains some javascript code, so we create a user control "ContentBlockDesignerTemplate.ascx" and set the "EditorContentFilters" attribute of the HtmlEditor to "None":
001.
<%@ Control Language="C#" %>
002.
<%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sf" %>
003.
<%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI.Fields" TagPrefix="sf" %>
004.
<%@ Register Assembly="Telerik.Sitefinity" TagPrefix="designers" Namespace="Telerik.Sitefinity.Web.UI.ControlDesign" %>
005.
006.
<
sf:ResourceLinks
id
=
"resourcesLinks"
runat
=
"server"
>
007.
<
sf:ResourceFile
Name
=
"Styles/Window.css"
/>
008.
</
sf:ResourceLinks
>
009.
010.
<
telerik:RadWindowManager
011.
ID
=
"windowManager"
012.
runat
=
"server"
013.
Behaviors
=
"None"
014.
Skin
=
"Sitefinity"
015.
ShowContentDuringLoad
=
"false"
016.
VisibleStatusBar
=
"false"
017.
VisibleTitleBar
=
"true"
>
018.
<
Windows
>
019.
<
telerik:RadWindow
ID
=
"contentPages"
runat
=
"server"
Height
=
"250"
Width
=
"425"
Modal
=
"true"
NavigateUrl
=
"~/Sitefinity/Dialog/ContentPagesDialog"
ReloadOnShow
=
"true"
Behaviors
=
"Close"
/>
020.
<
telerik:RadWindow
ID
=
"preview"
runat
=
"server"
Height
=
"100"
Width
=
"100"
Modal
=
"true"
NavigateUrl
=
"~/Sitefinity/Dialog/ContentViewEditDialog?ControlDefinitionName=ContentBackend&ViewName=ContentBackendPreview&SuppressBackToButtonLabelModify=true"
/>
021.
</
Windows
>
022.
</
telerik:RadWindowManager
>
023.
024.
<
div
id
=
"selectorTag"
style
=
"display: none;"
class
=
"sfDesignerSelector sfFlatDialogSelector"
>
025.
<
designers:ContentSelector
026.
ID
=
"sharedContentSelector"
027.
runat
=
"server"
028.
TitleText="<%$Resources:ContentResources, SelectSharedContentYouWantToUse %>"
029.
BindOnLoad="false"
030.
AllowMultipleSelection="false"
031.
WorkMode="List"
032.
SearchBoxInnerText=""
033.
ShowProvidersList="true"
034.
SearchBoxTitleText="<%$Resources:Labels, NarrowByTyping %>"
035.
ListModeClientTemplate="<
span
class
=
'sfItemTitle'
>Title</
span
><
span
class
=
'sf_binderCommand_viewContentPages'
>PagesCountUIString</
span
>">
036.
</
designers:ContentSelector
>
037.
</
div
>
038.
<
sf:PromptDialog
039.
ID
=
"shareContentDialog"
040.
Title="<%$ Resources:ContentResources, SharedContent %>"
041.
TextFieldTitle="<%$ Resources:ContentResources, Title %>"
042.
runat="server"
043.
Width="350"
044.
Height="300"
045.
Mode="Input"
046.
AllowCloseButton="true"
047.
ShowOnLoad="false">
048.
<
Commands
>
049.
<
sf:CommandToolboxItem
Text="<%$ Resources:ContentResources, ShareThisContent %>" CommandName="shareContent" CommandType="SaveButton" WrapperTagName="LI" />
050.
<
sf:CommandToolboxItem
Text="<%$ Resources:Labels, Cancel %>" CommandName="cancel" CommandType="CancelButton" WrapperTagName="LI" />
051.
</
Commands
>
052.
</
sf:PromptDialog
>
053.
054.
<
sf:PromptDialog
055.
ID
=
"unshareContentDialog"
056.
Message="<%$ Resources:ContentResources, AreYouSureYouWantToUnshareThisContent %>"
057.
runat="server"
058.
Width="300"
059.
Height="300"
060.
Mode="Confirm"
061.
AllowCloseButton="true"
062.
InputRows="5"
063.
ShowOnLoad="false">
064.
<
Commands
>
065.
<
sf:CommandToolboxItem
Text="<%$ Resources:ContentResources, UnshareThisContent %>" CommandName="unshareContent" CommandType="NormalButton" WrapperTagName="LI" />
066.
<
sf:CommandToolboxItem
Text="<%$ Resources:Labels, Cancel %>" CommandName="cancel" CommandType="CancelButton" WrapperTagName="LI" />
067.
</
Commands
>
068.
</
sf:PromptDialog
>
069.
070.
<
sf:FormManager
ID
=
"formManager"
runat
=
"server"
/>
071.
<
div
id
=
"editView"
class
=
"sfContentBlocksDesignerWrp"
>
072.
<
sf:HtmlField
073.
ID
=
"htmlEditor"
074.
runat
=
"server"
075.
Width
=
"99%"
076.
Height
=
"370px"
077.
EditorContentFilters
=
"None"
078.
EditorStripFormattingOptions
=
"MSWord,Css,Font,Span,ConvertWordLists"
079.
DisplayMode
=
"Write"
080.
FixCursorIssue
=
"True"
>
081.
</
sf:HtmlField
>
082.
<
sf:CommandBar
id
=
"editViewCommandBar"
runat
=
"server"
WrapperTag
=
"div"
WrapperCssClass
=
"sfContentBlocksBtnAreaBottom"
>
083.
<
Commands
>
084.
<
sf:CommandToolboxItem
runat
=
"server"
CommandName
=
"selectSharedContent"
CommandType
=
"NormalButton"
CssClass
=
"sfChange"
Text="<%$Resources:ContentResources, SelectFromExistingSharedContent %>" />
085.
<
sf:CommandToolboxItem
runat
=
"server"
CommandName
=
"shareContent"
CommandType
=
"NormalButton"
CssClass
=
"sfChange"
Text="<%$Resources:ContentResources, ShareThisContentAcrossPages %>" />
086.
</
Commands
>
087.
</
sf:CommandBar
>
088.
</
div
>
089.
<
div
id
=
"previewAndEditContentView"
class
=
"sfContentBlocksDesignerWrp"
>
090.
<
div
class
=
"sfNeutral sfClearfix"
>
091.
<
asp:Label
ID
=
"sharedContentLabel"
runat
=
"server"
Text="<%$Resources:ContentResources, ThisContentIsShared %>"></
asp:Label
>
092.
<
asp:HyperLink
ID
=
"viewPagesLink"
runat
=
"server"
NavigateUrl
=
"javascript:void(0);"
CssClass
=
""
>
093.
<
asp:Literal
ID
=
"viewPagesLiteral"
runat
=
"server"
Text="<%$Resources:ContentResources, ViewAffectedPages %>" />
094.
</
asp:HyperLink
>
095.
<
div
id
=
"editOutDatedContentView"
>
096.
<
span
class
=
"sfFailure"
>
097.
<
asp:Literal
ID
=
"newerVersionLabel1"
runat
=
"server"
Text="<%$Resources:ContentResources, ThereIsNewerVersionOfThisContent %>" />
098.
<
asp:HyperLink
ID
=
"previewLink"
runat
=
"server"
NavigateUrl
=
"javascript:void(0);"
CssClass
=
""
>
099.
<
asp:Literal
ID
=
"previewLiteral"
runat
=
"server"
Text="<%$Resources:Labels, Preview %>" />
100.
</
asp:HyperLink
>
101.
<
asp:Literal
ID
=
"orLabel"
runat
=
"server"
Text="<%$Resources:Labels, or %>" />
102.
<
asp:HyperLink
ID
=
"updateLink"
runat
=
"server"
NavigateUrl
=
"javascript:void(0);"
CssClass
=
""
>
103.
<
asp:Literal
ID
=
"updateLiteral"
runat
=
"server"
Text="<%$Resources:Labels, Update %>" />
104.
</
asp:HyperLink
>
105.
<
asp:Literal
ID
=
"newerVersionLabel2"
runat
=
"server"
Text="<%$Resources:ContentResources, WithTheNewerVersion %>" />
106.
</
span
>
107.
</
div
>
108.
109.
<
sf:CommandBar
id
=
"commandBar"
runat
=
"server"
WrapperTag
=
"div"
WrapperCssClass
=
"sfContentBlocksBtnAreaTop"
>
110.
<
Commands
>
111.
<
sf:CommandToolboxItem
runat
=
"server"
CommandName
=
"editContent"
CommandType
=
"NormalButton"
CssClass
=
"sfChange"
Text="<%$Resources:ContentResources, EditThisContent %>" />
112.
<
sf:CommandToolboxItem
runat
=
"server"
CommandName
=
"unshareContent"
CommandType
=
"NormalButton"
CssClass
=
"sfChange"
Text="<%$Resources:ContentResources, Unshare %>" />
113.
</
Commands
>
114.
</
sf:CommandBar
>
115.
</
div
>
116.
<
sf:SitefinityLabel
id
=
"contentLabel"
runat
=
"server"
WrapperTagName
=
"div"
CssClass
=
"sfSharedContentPreviewWrp"
></
sf:SitefinityLabel
>
117.
<
sf:HtmlField
118.
ID
=
"contentEditor"
119.
runat
=
"server"
120.
Width
=
"99%"
121.
Height
=
"370px"
122.
EditorContentFilters
=
"None"
123.
EditorStripFormattingOptions
=
"MSWord,Css,Font,Span,ConvertWordLists"
124.
DisplayMode
=
"Write"
125.
FixCursorIssue
=
"True"
>
126.
</
sf:HtmlField
>
127.
</
div
>
128.
129.
<
sf:ClientLabelManager
id
=
"clientLabelManager"
runat
=
"server"
>
130.
<
Labels
>
131.
<
sf:ClientLabel
ClassId
=
"ContentResources"
Key
=
"ThisContentIsShared"
runat
=
"server"
/>
132.
<
sf:ClientLabel
ClassId
=
"ContentResources"
Key
=
"ThisContentIsSharedAccross"
runat
=
"server"
/>
133.
<
sf:ClientLabel
ClassId
=
"ContentResources"
Key
=
"ViewAffectedPages"
runat
=
"server"
/>
134.
<
sf:ClientLabel
ClassId
=
"PageResources"
Key
=
"Page"
runat
=
"server"
/>
135.
<
sf:ClientLabel
ClassId
=
"PageResources"
Key
=
"Pages"
runat
=
"server"
/>
136.
<
sf:ClientLabel
ClassId
=
"Labels"
Key
=
"Back"
runat
=
"server"
/>
137.
<
sf:ClientLabel
ClassId
=
"Labels"
Key
=
"SaveChanges"
runat
=
"server"
/>
138.
<
sf:ClientLabel
ClassId
=
"Labels"
Key
=
"Save"
runat
=
"server"
/>
139.
</
Labels
>
140.
</
sf:ClientLabelManager
>
141.
142.
<
script
type
=
"text/javascript"
>
143.
$("body").addClass("sfContentBlockDesigner");
144.
</
script
>
Hello Amrelsayed,
This is stranged. I reproduced your setup and for everything worked from the first time. I added the following <script> tag
<script typr="javascript">alert("Test");</script>
and upon clicking Save I even got an alert that says Test. Then after reopening the content block the snippet was there. Could you provide some additional info and/or screenshots please.
Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>
Hello Lubomir,
Please review the attached screen shots, first I created a content block, saving it then trying to reopen the content block, the js snippet disappeared (2-OpenSavedContentBlock.png).
Cancel the editing, then trying to reopen the content block, the js snippet code is there (3-ReopenContentBlock.png)
Any suggestions?
Thanks.
Hi Amr,
I think you forgot to attach 2-OpenSavedContentBlock.png and 3-ReopenContentBlock.png - there is just Administration.png, which shows the template mapping. Now, I was testing when adding content block widgets to a page and everything worked ok. When I tested by adding a Content block under the menu Content -> Content blocks my <script> tags were stripped at first, and on the second time I went directly to HTML view, which looks like a cached page, and this is why the <script> tags are there. If you reload the page the <script> tags disappear again.
This means that you map the wrong Content block template, since the HtmlField does not allow script tags.
I think you need to remap some other template in order for this screen to work as the one for the page widget.
Best wishes,
Lubomir Velkov
the Telerik team
Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>
Hi Lubomir,
Do you mean that I mapped the wrong html template for the content block?
If so can you send to me the right template used in Sitefinity 4.2?
Thanks.
Hey Amr, In 4.2 they've exposed most of the radeditor settings in the backend of sf4 now so you no longer need to map external views (awesome). All the filters and tools file settings should be there, would that work? (I'm on mobile so I dont have an easy way to get you a link, but on my site I the articles>how to section there's instructions on setting up the tools file.XML...so the filters are in the same area. (don't forget to ummap your view) ...this all assumes you only mapped the view to change the editor settings. Steve
We are still having the same issue that javascript snippet codes disappear.
These are the detailed steps I followed:
1- I created a new testing 4.2 website. (with no mapping to the any controls)
2- Make sure that the "None" filters are applied to the radeditor (please refer to AdministrationSettings.png)
3- Create a new content block from (Content > Content blocks) and add a js snippet code in the html design mode of the editor (CreateContentBlock.png) then I saved the content block (which returns to the Content blocks list).
4- If I open this content in the edit mode again, a cached page will be opened and the the editor will be opened in the html design mode with the js snippet code.
5- But if I try to go anywhere to the website (go to the news page for example) and come back to the content blocks list, and reopen the content block in the edit mode, the editor will be opened in the design mode, and by switching to the html mode the js will not be there. (ReopenContentBlock.png)
6- When I click "back to content blocks" (which returns to the content blocks list), then reopen the content block in the edit mode, the editor will be opened in the html mode and the js snippet of code is there (EditContentBlock.png)
We would appreciete proper attention as this has been pending for a while.
Thanks.
Hello Amr,
Please check this following blog post on how to remap the HtmlField - I suggest you simple override the whole HtmlField behaviour around the entire Backend:
http://www.sitefinity.com/blogs/joshmorales/posts/11-07-26/customizing_sitefinity_4_controls_with_the_viewmap.aspx
Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>