Hi Telerik Support,
I have been very frustrated as my controls such as RadEditor control & RadUpload control are loosing its SKIN when I try to edit any record within my RadTreeList.
When I try to insert any item controls are shown properly (i.e. with proper SKIN) but when I try to edit an partcular record its really behaves weirdly an that gives me headaches.
Please find the attachment .
While the placement of my controls are shown below as :-
Can you help me where thing are wrong .
Also, I have added the code on Page_Load event as :-
But commented code is not working either (i.e. I'm not able to find the either RadEditor or RadUpload Control)
Please help !
Ajay
I have been very frustrated as my controls such as RadEditor control & RadUpload control are loosing its SKIN when I try to edit any record within my RadTreeList.
When I try to insert any item controls are shown properly (i.e. with proper SKIN) but when I try to edit an partcular record its really behaves weirdly an that gives me headaches.
Please find the attachment .
While the placement of my controls are shown below as :-
<
telerik:RadTreeList
ID
=
"KnowledgeBaseRadTreeList"
runat
=
"server"
AllowPaging
=
"True"
DataSourceID
=
"KnowledgeBaseSqlDataSource"
PageSize
=
"20"
DataKeyNames
=
"KnowledgeBase_ID"
ParentDataKeyNames
=
"KnowledgeBase_Parent_ID"
AutoGenerateColumns
=
"False"
Width
=
"100%"
OnInsertCommand
=
"KnowledgeBaseRadTreeList_InsertCommand"
OnItemCommand
=
"KnowledgeBaseRadTreeList_ItemCommand"
OnItemDrop
=
"KnowledgeBaseRadTreeList_ItemDrop"
OnUpdateCommand
=
"KnowledgeBaseRadTreeList_UpdateCommand"
OnItemDataBound
=
"KnowledgeBaseRadTreeList_ItemDataBound"
>
<
PagerStyle
Mode
=
"NextPrevNumericAndAdvanced"
/>
<
Columns
>
<
telerik:TreeListEditCommandColumn
UniqueName
=
"InsertCommandColumn"
ButtonType
=
"ImageButton"
AddRecordText
=
"Add"
ShowEditButton
=
"true"
ItemStyle-CssClass
=
"MyImageButton"
>
<
ItemStyle
HorizontalAlign
=
"Left"
VerticalAlign
=
"Top"
Width
=
"60px"
/>
<
HeaderStyle
VerticalAlign
=
"Top"
HorizontalAlign
=
"Left"
Width
=
"60px"
/>
</
telerik:TreeListEditCommandColumn
>
<
telerik:TreeListTemplateColumn
DataField
=
"KnowledgeBase_Title"
UniqueName
=
"KnowledgeBase_Title"
HeaderText
=
"Title"
>
<
ItemTemplate
>
<
asp:Label
ID
=
"KnowledgeBaseTitleLabel"
runat
=
"server"
Text='<%# Bind("KnowledgeBase_Title") %>'></
asp:Label
>
</
ItemTemplate
>
<
ItemStyle
HorizontalAlign
=
"Left"
VerticalAlign
=
"Top"
Width
=
"120px"
/>
<
HeaderStyle
HorizontalAlign
=
"Left"
VerticalAlign
=
"Top"
Width
=
"120px"
/>
</
telerik:TreeListTemplateColumn
>
<
telerik:TreeListTemplateColumn
DataField
=
"FAQ_Description"
UniqueName
=
"FAQ_Description"
HeaderText
=
"Description"
>
<
ItemTemplate
>
<
asp:Label
ID
=
"KnowledgeBaseDescriptionLabel"
runat
=
"server"
Text='<%# ( Eval("KnowledgeBase_Description").ToString().Length > 150)? string.Concat(Eval("KnowledgeBase_Description").ToString().Substring(0, 150), ".....") : Eval("KnowledgeBase_Description") %>'></
asp:Label
>
<
telerik:RadToolTip
ID
=
"KnowledgeBaseDescriptionRadToolTip"
TargetControlID='<%# ( Eval("KnowledgeBase_Description").ToString().Length > 150)? "KnowledgeBaseDescriptionLabel" : "" %>'
Width="400px" Height="300px" ContentScrolling="Y" runat="server" HideDelay="1000"
Position="TopCenter" RelativeTo="Element" ShowDelay="1000">
<%# Eval("KnowledgeBase_Description")%>
</
telerik:RadToolTip
>
</
ItemTemplate
>
<
ItemStyle
HorizontalAlign
=
"Left"
VerticalAlign
=
"Top"
/>
<
HeaderStyle
HorizontalAlign
=
"Left"
VerticalAlign
=
"Top"
/>
</
telerik:TreeListTemplateColumn
>
<
telerik:TreeListTemplateColumn
DataField
=
"ParentName"
UniqueName
=
"ParentName"
HeaderText
=
"Parent Item"
>
<
ItemTemplate
>
<
asp:Label
ID
=
"ParentTitleLabel"
runat
=
"server"
Text='<%# Bind("ParentName") %>'></
asp:Label
>
</
ItemTemplate
>
<
ItemStyle
HorizontalAlign
=
"Left"
VerticalAlign
=
"Top"
Width
=
"100px"
/>
<
HeaderStyle
HorizontalAlign
=
"Left"
VerticalAlign
=
"Top"
Width
=
"100px"
/>
</
telerik:TreeListTemplateColumn
>
<
telerik:TreeListTemplateColumn
DataField
=
"KnowledgeBase_Order"
UniqueName
=
"KnowledgeBase_Order"
HeaderText
=
"Order"
>
<
ItemTemplate
>
<
telerik:RadNumericTextBox
ID
=
"KnowledgeBaseOrderRadNumericTextBox"
MinValue
=
"1"
NumberFormat-DecimalDigits
=
"0"
Enabled
=
"false"
runat
=
"server"
Width
=
"50px"
Text='<%# Bind("KnowledgeBase_Order") %>'>
<
EnabledStyle
Font-Names
=
"Verdana"
HorizontalAlign
=
"Right"
/>
</
telerik:RadNumericTextBox
>
</
ItemTemplate
>
<
ItemStyle
HorizontalAlign
=
"Center"
VerticalAlign
=
"Top"
Width
=
"60px"
/>
<
HeaderStyle
HorizontalAlign
=
"Center"
VerticalAlign
=
"Top"
Width
=
"60px"
/>
</
telerik:TreeListTemplateColumn
>
<
telerik:TreeListTemplateColumn
HeaderText
=
"Status"
DataField
=
"KnowledgeBase_ActiveStatus"
UniqueName
=
"KnowledgeBase_ActiveStatus"
>
<
ItemTemplate
>
<
asp:Label
ID
=
"ActiveStatusLabel"
runat
=
"server"
CssClass='<%# (Convert.ToBoolean(Eval("KnowledgeBase_ActiveStatus"))) ? "active" : "inactive" %>'
ToolTip='<%# (Convert.ToBoolean(Eval("KnowledgeBase_ActiveStatus"))) ? "Active" : "Inactive" %>'
Text=" "></
asp:Label
>
</
ItemTemplate
>
<
ItemStyle
HorizontalAlign
=
"Center"
VerticalAlign
=
"Top"
Width
=
"60px"
/>
<
HeaderStyle
HorizontalAlign
=
"Center"
VerticalAlign
=
"Top"
Width
=
"60px"
/>
</
telerik:TreeListTemplateColumn
>
<
telerik:TreeListTemplateColumn
DataField
=
"KnowledgeBase_ActiveStatus"
HeaderText
=
"Action"
UniqueName
=
"ActiveStatus"
>
<
ItemTemplate
>
<
asp:ImageButton
ID
=
"ActiveInactiveButton"
runat
=
"server"
ToolTip='<%# (Convert.ToBoolean(Eval("KnowledgeBase_ActiveStatus"))) ? "Make inactive" : "Make active" %>'
Width="14px" Height="14px" CommandName="ActiveInactive" ImageUrl='<%# (Convert.ToBoolean(Eval("KnowledgeBase_ActiveStatus"))) ? "../App_Themes/ELPISCMS/images/inactive.png" : "../App_Themes/ELPISCMS/images/active.png" %>' />
</
ItemTemplate
>
<
ItemStyle
HorizontalAlign
=
"Center"
VerticalAlign
=
"Top"
Width
=
"60px"
/>
<
HeaderStyle
HorizontalAlign
=
"Center"
VerticalAlign
=
"Top"
Width
=
"60px"
/>
</
telerik:TreeListTemplateColumn
>
</
Columns
>
<
EditFormSettings
EditFormType
=
"Template"
PopUpSettings-Width
=
"100%"
>
<
FormTemplate
>
<
asp:Panel
ID
=
"DetailsPanel"
runat
=
"server"
DefaultButton
=
"SaveRadButton"
>
<
table
border
=
"0"
cellpadding
=
"0"
cellspacing
=
"5"
class
=
"innertable"
>
<
tr
>
<
td
class
=
"td18"
>
Title : <
span
class
=
"mandatorymark"
>*</
span
>
</
td
>
<
td
class
=
"td82"
>
<
telerik:RadTextBox
ID
=
"KnowledgeBaseTitleRadTextBox"
runat
=
"server"
SkinID
=
"KnowledgeBaseTitleTitleRadTextBox"
>
</
telerik:RadTextBox
>
<
asp:RequiredFieldValidator
ID
=
"KnowledgeBaseTitleRequiredFieldValidator"
runat
=
"server"
ValidationGroup
=
"KnowledgeBaseValidationGroup"
Display
=
"Dynamic"
SetFocusOnError
=
"false"
ControlToValidate
=
"KnowledgeBaseTitleRadTextBox"
CssClass
=
"requiredfield"
ErrorMessage
=
"Required!"
></
asp:RequiredFieldValidator
>
</
td
>
</
tr
>
<
tr
>
<
td
class
=
"td18"
>
Description : <
span
class
=
"mandatorymark"
>*</
span
>
</
td
>
<
td
class
=
"td82"
>
<%--<
telerik:RadTextBox
ID
=
"KnowledgeBaseDescriptionRadTextBox"
runat
=
"server"
TextMode
=
"MultiLine"
Rows
=
"8"
SkinID
=
"KnowledgeBaseResourceDescriptionRadTextBox"
>
</
telerik:RadTextBox
>--%>
<
telerik:RadEditor
ID
=
"KnowledgeBaseDescriptionRadEditor"
runat
=
"server"
AutoResizeHeight
=
"false"
EnableResize
=
"false"
OnClientLoad
=
"OnClientLoad"
EditModes
=
"Design, Html"
AllowScripts
=
"false"
ContentFilters
=
"RemoveScripts,MakeUrlsAbsolute,FixUlBoldItalic,FixEnclosingP,IECleanAnchors,MozEmStrong,ConvertFontToSpan,ConvertToXhtml,IndentHTMLContent"
NewLineBr
=
"true"
StripFormattingOptions
=
"AllExceptNewLines"
StripFormattingOnPaste
=
"AllExceptNewLines"
Height
=
"350px"
Width
=
"700px"
>
<
ImageManager
ViewPaths
=
"~/uploads/editoruploadimages"
UploadPaths
=
"~/uploads/editoruploadimages"
DeletePaths
=
"~/uploads/editoruploadimages"
/>
<
CssFiles
>
<
telerik:EditorCssFile
Value
=
""
/>
</
CssFiles
>
<
ContextMenus
>
<
telerik:EditorContextMenu
Enabled
=
"true"
>
<
telerik:EditorTool
Name
=
"Cut"
/>
<
telerik:EditorTool
Name
=
"Copy"
/>
<
telerik:EditorTool
Name
=
"Paste"
/>
</
telerik:EditorContextMenu
>
</
ContextMenus
>
<
Tools
>
<
telerik:EditorToolGroup
>
<
telerik:EditorTool
Name
=
"AjaxSpellCheck"
/>
<
telerik:EditorTool
Name
=
"FindAndReplace"
/>
<
telerik:EditorTool
Name
=
"SelectAll"
/>
<
telerik:EditorTool
Name
=
"Cut"
/>
<
telerik:EditorTool
Name
=
"Copy"
/>
<
telerik:EditorTool
Name
=
"Paste"
/>
<
telerik:EditorTool
Name
=
"Redo"
/>
<
telerik:EditorTool
Name
=
"Undo"
/>
<
telerik:EditorTool
Name
=
"InsertLink"
/>
</
telerik:EditorToolGroup
>
<
telerik:EditorToolGroup
>
<
telerik:EditorTool
Name
=
"Bold"
/>
<
telerik:EditorTool
Name
=
"Italic"
/>
<
telerik:EditorTool
Name
=
"Underline"
/>
</
telerik:EditorToolGroup
>
<
telerik:EditorToolGroup
>
<
telerik:EditorTool
Name
=
"FontName"
/>
<
telerik:EditorTool
Name
=
"RealFontSize"
/>
<
telerik:EditorTool
Name
=
"ApplyClass"
/>
</
telerik:EditorToolGroup
>
<
telerik:EditorToolGroup
>
<
telerik:EditorTool
Name
=
"ForeColor"
/>
<
telerik:EditorTool
Name
=
"BackColor"
/>
<
telerik:EditorTool
Name
=
"FormatStripper"
/>
</
telerik:EditorToolGroup
>
<
telerik:EditorToolGroup
>
<
telerik:EditorTool
Name
=
"InsertAnchor"
/>
<
telerik:EditorTool
Name
=
"InsertCustomLink"
/>
<
telerik:EditorTool
Name
=
"InsertDate"
/>
<
telerik:EditorTool
Name
=
"InsertGroupbox"
/>
<
telerik:EditorTool
Name
=
"InsertHorizontalRule"
/>
<
telerik:EditorTool
Name
=
"InsertUnorderedList"
/>
<
telerik:EditorTool
Name
=
"InsertOrderedList"
/>
<
telerik:EditorTool
Name
=
"Paragraph"
/>
<
telerik:EditorTool
Name
=
"InsertTable"
/>
<
telerik:EditorTool
Name
=
"InsertSnippet"
/>
</
telerik:EditorToolGroup
>
<
telerik:EditorToolGroup
>
<
telerik:EditorTool
Name
=
"Indent"
/>
<
telerik:EditorTool
Name
=
"Outdent"
/>
<
telerik:EditorTool
Name
=
"JustifyRight"
/>
<
telerik:EditorTool
Name
=
"JustifyLeft"
/>
<
telerik:EditorTool
Name
=
"JustifyCenter"
/>
</
telerik:EditorToolGroup
>
<
telerik:EditorToolGroup
>
<
telerik:EditorTool
Name
=
"LinkManager"
/>
<
telerik:EditorTool
Name
=
"ImageManager"
/>
<
telerik:EditorTool
Name
=
"ImageMapDialog"
/>
<
telerik:EditorTool
Name
=
"DocumentManager"
/>
<
telerik:EditorTool
Name
=
"ConvertToLower"
/>
<
telerik:EditorTool
Name
=
"ConvertToUpper"
/>
<
telerik:EditorTool
Name
=
"ToggleScreenMode"
/>
</
telerik:EditorToolGroup
>
</
Tools
>
</
telerik:RadEditor
>
<
div
style
=
"float: right;"
>
<
span
id
=
"counter"
style
=
"text-align: right;"
></
span
>
</
div
>
<
asp:RequiredFieldValidator
ID
=
"KnowledgeBaseDescriptionRequiredFieldValidator"
runat
=
"server"
ValidationGroup
=
"KnowledgeBaseValidationGroup"
Display
=
"Dynamic"
SetFocusOnError
=
"false"
ControlToValidate
=
"KnowledgeBaseDescriptionRadEditor"
CssClass
=
"requiredfield"
ErrorMessage
=
"Required!"
></
asp:RequiredFieldValidator
>
</
td
>
</
tr
>
<
td
class
=
"td18"
>
Upload Document :
</
td
>
<
td
class
=
"td82"
>
<
telerik:RadUpload
ID
=
"UploadDocumentRadUpload"
runat
=
"server"
ControlObjectsVisibility
=
"AddButton,RemoveButtons"
CssClass
=
"RadUpload"
InputSize
=
"50"
AllowedFileExtensions
=
".png,.jpg,.jpeg,.gif"
oncontextmenu
=
"return false;"
onpaste
=
"return false;"
ReadOnlyFileInputs
=
"true"
/>
<
span
style
=
"line-height: 15px; vertical-align: top;"
>
<
asp:Label
ID
=
"ImageExtensionLabel"
runat
=
"server"
CssClass
=
"UploadLabel"
Text="<br/>(Only .PNG,.JPG,.JPEG,.GIF images allowed)" />
<
br
/>
<
asp:Label
runat
=
"server"
ID
=
"ImageNameLabel"
Visible
=
"false"
/>
</
span
>
<
br
/>
<
telerik:RadProgressArea
ID
=
"UploadDocumentRadProgressArea"
runat
=
"server"
ProgressIndicators
=
"CurrentFileName"
>
</
telerik:RadProgressArea
>
<
asp:CustomValidator
ID
=
"ValidateExtensionCustomValidator"
CssClass
=
"requiredfield"
runat
=
"server"
Display
=
"Dynamic"
ValidationGroup
=
"KnowledgeBaseValidationGroup"
ClientValidationFunction
=
"ValidateExtensions"
SetFocusOnError
=
"true"
>
<
span
style
=
"FONT-SIZE: 11px;"
>Invalid extension! Only (jpg, jpeg, gif, png) extension are allowed to upload.</
span
>
</
asp:CustomValidator
>
</
td
>
<
tr
>
<
td
>
</
td
>
<
td
class
=
"td82"
>
<
telerik:RadGrid
ID
=
"FilesRadGrid"
runat
=
"server"
AllowFilteringByColumn
=
"True"
AllowPaging
=
"True"
AllowSorting
=
"True"
AutoGenerateColumns
=
"False"
CellSpacing
=
"0"
DataSourceID
=
"FilesSqlDataSource"
GridLines
=
"None"
Width
=
"530px"
Visible
=
"false"
OnItemCommand
=
"FilesRadGrid_ItemCommand"
>
<
MasterTableView
DataKeyNames
=
"KnowledgeBase_Uploads_ID"
DataSourceID
=
"FilesSqlDataSource"
>
<
RowIndicatorColumn
FilterControlAltText
=
"Filter RowIndicator column"
>
<
HeaderStyle
Width
=
"20px"
/>
</
RowIndicatorColumn
>
<
ExpandCollapseColumn
FilterControlAltText
=
"Filter ExpandColumn column"
>
<
HeaderStyle
Width
=
"20px"
/>
</
ExpandCollapseColumn
>
<
Columns
>
<
telerik:GridBoundColumn
DataField
=
"FileName"
FilterControlAltText
=
"Filter FileName column"
HeaderText
=
"File Name"
SortExpression
=
"FileName"
UniqueName
=
"FileName"
FilterControlWidth
=
"80%"
>
<
HeaderStyle
HorizontalAlign
=
"Center"
VerticalAlign
=
"Middle"
/>
<
ItemStyle
HorizontalAlign
=
"Left"
Font-Size
=
"11px"
Font-Names
=
"Arial"
VerticalAlign
=
"Middle"
/>
</
telerik:GridBoundColumn
>
<
telerik:GridTemplateColumn
HeaderText
=
"Action"
AllowFiltering
=
"false"
>
<
ItemTemplate
>
<
asp:ImageButton
ID
=
"DeleteImageButton"
runat
=
"server"
ToolTip
=
"Delete"
CommandName
=
"Delete"
ImageUrl
=
"~/App_Themes/ELPISCMS/images/delete.png"
OnClientClick
=
"if (!confirm('Are you sure, you want to delete this record?')) {return false;}"
CommandArgument='<%# Eval("KnowledgeBase_Uploads_ID") +":"+ Eval("KnowledgeBase_Uploads_ID") %>' />
</
ItemTemplate
>
<
ItemStyle
HorizontalAlign
=
"Center"
VerticalAlign
=
"Middle"
Width
=
"50px"
/>
<
HeaderStyle
HorizontalAlign
=
"Center"
VerticalAlign
=
"Middle"
Width
=
"50px"
/>
</
telerik:GridTemplateColumn
>
</
Columns
>
<
EditFormSettings
>
<
EditColumn
FilterControlAltText
=
"Filter EditCommandColumn column"
/>
</
EditFormSettings
>
</
MasterTableView
>
<
FilterMenu
EnableImageSprites
=
"False"
/>
<
HeaderContextMenu
CssClass
=
"GridContextMenu GridContextMenu_Default"
/>
</
telerik:RadGrid
>
<
asp:SqlDataSource
ID
=
"FilesSqlDataSource"
runat
=
"server"
ConnectionString="<%$ ConnectionStrings:elpis_cmsConnectionString %>"
SelectCommand="Usp_KnowledgeBase_Uploads_Select" SelectCommandType="StoredProcedure">
<
SelectParameters
>
<
asp:ControlParameter
ConvertEmptyStringToNull
=
"true"
ControlID
=
"KnowledgeBaseIDHiddenField"
DbType
=
"Int32"
Name
=
"KnowledgeBase_ID"
PropertyName
=
"Value"
/>
</
SelectParameters
>
</
asp:SqlDataSource
>
</
td
>
</
tr
>
<
tr
>
<
td
class
=
"td18"
>
Status :
</
td
>
<
td
class
=
"td82"
>
<
asp:RadioButton
ID
=
"ActiveRadioButton"
runat
=
"server"
CssClass
=
"radiobutton"
Checked
=
"true"
GroupName
=
"ActiveInactive"
/>Active
<
asp:RadioButton
ID
=
"InactiveRadioButton"
runat
=
"server"
CssClass
=
"radiobutton"
GroupName
=
"ActiveInactive"
/>Inactive
</
td
>
</
tr
>
<
tr
>
<
td
>
</
td
>
<
td
class
=
"td82"
>
<
telerik:RadButton
ID
=
"SaveRadButton"
runat
=
"server"
Text='<%# (Container is TreeListEditFormInsertItem) ? "Save" : "Update" %>'
CausesValidation="true" CommandName='<%# (Container is TreeListEditFormInsertItem) ? "PerformInsert" : "Update" %>'
ValidationGroup="KnowledgeBaseValidationGroup" Width="80px">
<
Icon
PrimaryIconUrl
=
"~/App_Themes/ELPISCMS/images/save2.png"
PrimaryIconLeft
=
"5"
PrimaryIconTop
=
"3"
/>
</
telerik:RadButton
>
<
telerik:RadButton
ID
=
"CancelRadButton"
runat
=
"server"
Text
=
"Cancel"
CommandName
=
"Cancel"
CausesValidation
=
"false"
Width
=
"80px"
>
<
Icon
PrimaryIconUrl
=
"~/App_Themes/ELPISCMS/images/cancel2.png"
PrimaryIconLeft
=
"5"
PrimaryIconTop
=
"3"
/>
</
telerik:RadButton
>
</
td
>
</
tr
>
</
table
>
</
asp:Panel
>
</
FormTemplate
>
</
EditFormSettings
>
<
ClientSettings
AllowItemsDragDrop
=
"true"
>
<
Selecting
AllowItemSelection
=
"True"
/>
</
ClientSettings
>
</
telerik:RadTreeList
>
<
asp:SqlDataSource
ID
=
"KnowledgeBaseSqlDataSource"
runat
=
"server"
ConnectionString="<%$ ConnectionStrings:elpis_cmsConnectionString %>"
SelectCommand="Usp_KnowledgeBase_Select" SelectCommandType="StoredProcedure">
</
asp:SqlDataSource
>
Can you help me where thing are wrong .
Also, I have added the code on Page_Load event as :-
protected
void
Page_Load(
object
sender, EventArgs e)
{
common.CheckLogin();
if
(!IsPostBack)
{
KnowledgeBaseRadTreeList.ExpandAllItems();
DisableReordering();
MessageLabel.Text =
string
.Empty;
MessageLabel.Visible =
false
;
SuccessImage.Visible =
false
;
NoChangesImage.Visible =
false
;
//foreach (TreeListDataItem item in KnowledgeBaseRadTreeList.Items)
//{
// RadEditor KnowledgeBaseDescriptionRadEditor = (item.FindControl("KnowledgeBaseDescriptionRadEditor") as RadEditor);
// KnowledgeBaseDescriptionRadEditor.EnableAjaxSkinRendering = true;
// RadUpload UploadDocumentRadUpload = (item.FindControl("UploadDocumentRadUpload") as RadUpload);
// UploadDocumentRadUpload.EnableAjaxSkinRendering = true;
//}
}
}
Please help !
Ajay