Inside an UpdatePanel, I have an ajax:ReorderList. In the ReorderList's InsertItemTemplate, I have a Panel with two RadEditors. I display the Panel in an ajax:ModalPopupExtender when the User clicks on a Button above the ReorderList.
Both RadEditors work just fine in IE versions 9 and up or in Firefox (tested versions 3.6.8, 8.0.1, 9.0.1, 27.0.1, and 28.0.1).
However, in Safari (version 4, 5, or 5.1.7) or Chrome 33, Users cannot enter Text into either RadEditor...
The generated HTML looks very similar in all browsers, a <textarea> is created, even though I have tried setting the Editors' EnableTextareaMode="false" in the markup.
Please help me figure out what I'm doing wrong...
Here is my aspx markup
Both RadEditors work just fine in IE versions 9 and up or in Firefox (tested versions 3.6.8, 8.0.1, 9.0.1, 27.0.1, and 28.0.1).
However, in Safari (version 4, 5, or 5.1.7) or Chrome 33, Users cannot enter Text into either RadEditor...
The generated HTML looks very similar in all browsers, a <textarea> is created, even though I have tried setting the Editors' EnableTextareaMode="false" in the markup.
Please help me figure out what I'm doing wrong...
Here is my aspx markup
<
asp:UpdatePanel
runat
=
"server"
ID
=
"itemUpdatePanel"
UpdateMode
=
"Conditional"
>
<
ContentTemplate
>
<
div
class
=
"buttonPanelLeft"
>
<
SuperPanel:ContentButton
ID
=
"AddNewFAQItemButton"
runat
=
"server"
CssClass
=
"buttonShellWidthMedium"
Text
=
"Add FAQ Item"
OnClientClick
=
"return CheckSelectedCategory();"
meta:resourcekey
=
"AddNewFAQItemButton"
></
SuperPanel:ContentButton
>
</
div
>
<
div
class
=
"pad10Clear"
>
</
div
>
<
asp:Panel
runat
=
"server"
ID
=
"FAQContainerTitlePanel"
Style="margin-top: 5px; margin-bottom: 5px;
font-weight: bold;">
<
asp:Label
ID
=
"faqContainerTitleText"
runat
=
"server"
Text
=
"Frequently Asked Questions and Answers"
meta:resourcekey
=
"faqContainerTitleText"
/>
</
asp:Panel
>
<
ajax:ReorderList
ID
=
"itemList"
PostBackOnReorder
=
"True"
DataSourceID
=
"itemDataSource"
CssClass
=
"itemList"
DragHandleAlignment
=
"Top"
ItemInsertLocation
=
"End"
DataKeyField
=
"FAQID"
CallbackCssStyle
=
"callbackStyle"
SortOrderField
=
"SortOrder"
runat
=
"server"
LayoutType
=
"User"
AllowReorder
=
"True"
ShowInsertItem
=
"True"
>
<
DragHandleTemplate
>
<
div
class
=
"clear"
>
</
div
>
<
div
class
=
"groupItemDragHandle"
style
=
"float: left; *margin-left: -4px;"
>
</
div
>
<
div
class
=
"clear"
>
</
div
>
</
DragHandleTemplate
>
<
EditItemTemplate
>
<
asp:Panel
ID
=
"editFAQItemDiv"
runat
=
"server"
>
<
hr
style
=
"width: 100%;"
></
hr
>
<
div
class
=
"pad10Clear"
>
</
div
>
<
div
class
=
"groupItemCommandBar"
>
<
asp:Label
ID
=
"selectCategoryText"
runat
=
"server"
meta:resourcekey
=
"selectCategoryText"
Text
=
"FAQ Category:"
></
asp:Label
>
<
div
class
=
"clear"
>
</
div
>
<
asp:DropDownList
ID
=
"categoryList"
runat
=
"server"
CssClass
=
"groupItemDropDown"
DataSourceID
=
"categoryDataSource"
DataTextField
=
"CategoryName"
DataValueField
=
"CategoryID"
SelectedValue='<%# Bind("CategoryID") %>'>
</
asp:DropDownList
>
<
div
class
=
"pad10Clear"
>
</
div
>
<
div
>
<
asp:LinkButton
ID
=
"faqItemSaveButton"
runat
=
"server"
CommandName
=
"Update"
CssClass
=
"saveButton"
meta:resourcekey
=
"faqItemSaveButton"
OnClientClick
=
"endItemEdit();ShowAddNewCategoryButton(true);"
Style
=
"float: left;"
></
asp:LinkButton
>
<
asp:LinkButton
ID
=
"faqItemCancelButton"
runat
=
"server"
CommandName
=
"Cancel"
CssClass
=
"cancelButton"
meta:resourcekey
=
"faqItemCancelButton"
OnClientClick
=
"endItemEdit();ShowAddNewCategoryButton(true);"
Style
=
"float: left;"
></
asp:LinkButton
>
</
div
>
</
div
>
<
div
class
=
"pad5Clear"
>
</
div
>
<
div
class
=
"groupItemQuestion"
>
<
asp:Label
ID
=
"editQuestionLabel"
runat
=
"server"
Style
=
"font-size: 15pt;"
meta:resourcekey
=
"editQuestionLabel"
SkinID
=
"BoldFormFieldLabel"
Text
=
"Q:"
></
asp:Label
>
</
div
>
<
div
class
=
"faqError"
>
<
asp:RequiredFieldValidator
ID
=
"itemEditQuestionValidator"
runat
=
"server"
ControlToValidate
=
"questionEditor"
Display
=
"Dynamic"
meta:resourcekey
=
"itemEditQuestionValidator"
Text
=
"Question is required."
></
asp:RequiredFieldValidator
>
</
div
>
<
div
class
=
"pad10Clear"
>
</
div
>
<
div
class
=
"HtmlEditorItem"
>
<
telerik:RadEditor
ID
=
"questionEditor"
runat
=
"server"
Height
=
"200px"
Width
=
"99%"
StripFormattingOnPaste
=
"MSWordRemoveAll"
Content='<%# Bind("Question") %>' EnableResize="False"
SkinID="BasicSetOfTools" EnableEmbeddedSkins="False">
</
telerik:RadEditor
>
</
div
>
<
div
class
=
"pad10Clear"
>
</
div
>
<
div
class
=
"groupItemQuestion"
>
<
asp:Label
ID
=
"editAnswerLabel"
runat
=
"server"
meta:resourcekey
=
"editAnswerLabel"
Style
=
"font-size: 15pt;"
SkinID
=
"BoldFormFieldLabel"
Text
=
"A:"
></
asp:Label
>
</
div
>
<
asp:RequiredFieldValidator
ID
=
"itemEditAnswerValidator"
runat
=
"server"
ControlToValidate
=
"answerEditor"
Display
=
"Dynamic"
meta:resourcekey
=
"itemEditAnswerValidator"
Text
=
"Answer is required."
></
asp:RequiredFieldValidator
>
<
div
class
=
"pad10Clear"
>
</
div
>
<
div
class
=
"HtmlEditorItem"
>
<
telerik:RadEditor
ID
=
"answerEditor"
runat
=
"server"
Height
=
"200px"
Width
=
"99%"
EnableResize
=
"False"
StripFormattingOnPaste
=
"MSWordRemoveAll"
SkinID
=
"BasicSetOfTools"
Content='<%# Bind("Answer") %>'
EnableEmbeddedSkins="False">
</
telerik:RadEditor
>
</
div
>
<
hr
style
=
"width: 100%;"
></
hr
>
<
div
class
=
"pad10Clear"
>
</
div
>
<
asp:HiddenField
ID
=
"editSortOrderHiddenField"
runat
=
"server"
Value='<%# Bind("SortOrder") %>' />
</
asp:Panel
>
</
EditItemTemplate
>
<
InsertItemTemplate
>
<
asp:Panel
ID
=
"insertFAQItemPanel"
runat
=
"server"
Style="display: none; width: 800px;
background-color: #FFFFFF; padding: 8px 8px 8px 8px;">
<
SkinnedButton:SkinnedPanel
ID
=
"AddFAQItemSkinnedPanel"
runat
=
"server"
CssClass
=
"widthPx800"
GroupingText
=
"Add FAQ Item"
meta:resourcekey
=
"AddFAQItemSkinnedPanel"
>
<
div
class
=
"clear"
>
</
div
>
<
div
class
=
"panelInsidePadding"
>
<
div
class
=
"clear"
>
</
div
>
<
asp:Panel
ID
=
"insertPanel"
runat
=
"server"
CssClass
=
"groupItem"
Style
=
"margin-top: 10px;"
>
<
div
>
<
div
class
=
"groupItemQuestion"
>
<
asp:RequiredFieldValidator
ID
=
"itemAddQuestionValidator"
runat
=
"server"
ControlToValidate
=
"itemAddQuestionEditor"
Display
=
"Dynamic"
meta:resourcekey
=
"itemAddQuestionValidator"
Text
=
"Question is required."
ValidationGroup
=
"InsertFAQItem"
></
asp:RequiredFieldValidator
>
</
div
>
<
div
class
=
"groupItemQuestion"
>
<
asp:Label
ID
=
"enterQuestionText"
runat
=
"server"
meta:resourcekey
=
"enterQuestionText"
SkinID
=
"BoldFormFieldLabel"
Text
=
"Enter Question:"
></
asp:Label
>
</
div
>
<
div
class
=
"HtmlEditorItem"
>
<
div
class
=
"clearfix"
>
</
div
>
<
telerik:RadEditor
ID
=
"itemAddQuestionEditor"
runat
=
"server"
Height
=
"250px"
Width
=
"99%"
Content='<%# Bind("Question") %>' SkinID="BasicSetOfTools" EnableResize="False"
StripFormattingOnPaste="MSWordRemoveAll" EnableTextareaMode="False">
<
Modules
>
<
telerik:EditorModule
Name
=
"EditorStatsModule"
Enabled
=
"true"
Visible
=
"true"
/>
<
telerik:EditorModule
Name
=
"RadEditorStatistics"
Enabled
=
"true"
Visible
=
"False"
/>
</
Modules
>
</
telerik:RadEditor
>
<
div
class
=
"clearfix"
>
</
div
>
</
div
>
</
div
>
<
div
>
<
div
class
=
"groupItemAnswer"
>
<
asp:RequiredFieldValidator
ID
=
"itemAddAnswerValidator"
runat
=
"server"
ControlToValidate
=
"itemAddAnswerEditor"
Display
=
"Dynamic"
meta:resourcekey
=
"itemAddAnswerValidator"
Text
=
"Answer is required."
ValidationGroup
=
"InsertFAQItem"
></
asp:RequiredFieldValidator
>
</
div
>
<
div
class
=
"groupItemAnswer"
>
<
asp:Label
ID
=
"enterAnswerText"
runat
=
"server"
meta:resourcekey
=
"enterAnswerText"
SkinID
=
"BoldFormFieldLabel"
Text
=
"Enter Answer:"
></
asp:Label
>
</
div
>
<
div
class
=
"HtmlEditorItem"
>
<
telerik:RadEditor
ID
=
"itemAddAnswerEditor"
runat
=
"server"
Height
=
"250px"
Width
=
"99%"
Content='<%# Bind("Answer") %>' SkinID="BasicSetOfTools" EnableResize="False"
StripFormattingOnPaste="MSWordRemoveAll" EnableTextareaMode="False">
<
Modules
>
<
telerik:EditorModule
Name
=
"EditorStatsModule"
Enabled
=
"true"
Visible
=
"true"
/>
<
telerik:EditorModule
Name
=
"RadEditorStatistics"
Enabled
=
"true"
Visible
=
"False"
/>
</
Modules
>
</
telerik:RadEditor
>
</
div
>
</
div
>
</
asp:Panel
>
<
div
class
=
"clear"
>
</
div
>
<
div
class
=
"buttonPanel"
style
=
"margin: 5px 2px 5px 5px;"
>
<
SuperPanel:ContentButton
ID
=
"CancelAddFAQItemLinkButton"
runat
=
"server"
CommandName
=
"Cancel"
CssClass
=
"buttonShellWidthRegular"
ToolTip
=
"Cancel"
meta:resourcekey
=
"CancelAddFAQItemLinkButton"
>
</
SuperPanel:ContentButton
>
<
SuperPanel:ContentButton
ID
=
"SaveAddFAQItemLinkButton"
runat
=
"server"
CommandName
=
"Insert"
CssClass
=
"buttonShellWidthRegular"
meta:resourcekey
=
"SaveAddFAQItemLinkButton"
ToolTip
=
"Save"
ValidationGroup
=
"InsertFAQItem"
>
</
SuperPanel:ContentButton
>
</
div
>
<
div
class
=
"clear"
>
</
div
>
</
div
>
</
SkinnedButton:SkinnedPanel
>
</
asp:Panel
>
<
ajax:ModalPopupExtender
ID
=
"modalPopup"
runat
=
"server"
BackgroundCssClass
=
"popUpBackground"
BehaviorID
=
"AddNewFAQItemButton"
DynamicServicePath
=
""
Enabled
=
"True"
PopupControlID
=
"insertFAQItemPanel"
TargetControlID
=
"AddNewFAQItemButton"
OnLoad
=
"modalPopup_OnLoad"
>
</
ajax:ModalPopupExtender
>
<
div
class
=
"spacer"
>
</
div
>
</
InsertItemTemplate
>
<
ItemTemplate
>
<
hr
style
=
"width: 100%;"
></
hr
>
<
div
class
=
"pad5Clear"
>
</
div
>
<
div
class
=
"groupItem"
>
<
asp:Panel
ID
=
"groupItemCommandBar"
runat
=
"server"
CssClass
=
"groupItemCommandBar"
>
<
asp:LinkButton
ID
=
"itemEdit"
runat
=
"server"
CommandName
=
"Edit"
CssClass
=
"editButton"
meta:resourcekey
=
"itemEdit"
OnClientClick
=
"beginItemEdit(this.id); ShowAddNewCategoryButton(false);"
Style
=
"float: left;"
ToolTip
=
"Edit FAQ"
></
asp:LinkButton
>
<
div
style
=
"width: 5px; float: left;"
>
</
div
>
<
asp:LinkButton
ID
=
"itemDelete"
runat
=
"server"
CommandName
=
"Delete"
CssClass
=
"deleteButton"
ToolTip
=
"Delete FAQ"
meta:resourcekey
=
"itemDelete"
Style
=
"float: left;"
Text
=
""
></
asp:LinkButton
>
</
asp:Panel
>
<
div
class
=
"pad5Clear"
>
</
div
>
<
div
class
=
"groupItemQuestion"
>
<
asp:Label
ID
=
"TheQuestionIsLabel"
runat
=
"server"
meta:resourcekey
=
"TheQuestionIsLabel"
SkinID
=
"BoldFormFieldLabel"
Text
=
"Q:"
Style
=
"font-size: 15pt;"
></
asp:Label
>
<
div
class
=
"clear"
>
</
div
>
<
asp:Label
ID
=
"questionLabel"
runat
=
"server"
meta:resourcekey
=
"questionLabel"
Text='<%# Convert.ToString(Eval("Question")) %>'></
asp:Label
>
</
div
>
<
div
class
=
"groupItemAnswer"
>
<
asp:Label
ID
=
"TheAnswerIsLabel"
runat
=
"server"
meta:resourcekey
=
"TheAnswerIsLabel"
SkinID
=
"BoldFormFieldLabel"
Text
=
"A:"
Style
=
"font-size: 15pt;"
></
asp:Label
>
<
div
class
=
"clear"
>
</
div
>
<
asp:Label
ID
=
"answerLabel"
runat
=
"server"
meta:resourcekey
=
"answerLabel"
Text='<%# Convert.ToString(Eval("Answer")) %>'></
asp:Label
>
</
div
>
</
div
>
</
ItemTemplate
>
<
ReorderTemplate
>
<
div
class
=
"groupItemReorderCue"
>
</
div
>
</
ReorderTemplate
>
</
ajax:ReorderList
>
</
ContentTemplate
>
</
asp:UpdatePanel
>