I cannot seem to figure out how to do this. By default the editor is only occupying about 50% of the pane.
I have tried to follow the most recent example I could find of how to do this: http://www.telerik.com/community/forums/aspnet-ajax/editor/rad-editor-height-problem.aspx
But I am having problems when attempting to retrieve the pane height.
Here is my code for the javascript function:
The alert window that pops up for the pane height has nothing in it.
And here is the pane with the radeditor inside of it:
I have tried to follow the most recent example I could find of how to do this: http://www.telerik.com/community/forums/aspnet-ajax/editor/rad-editor-height-problem.aspx
But I am having problems when attempting to retrieve the pane height.
Here is my code for the javascript function:
function
OnClientLoad(editor) {
//sets the height of the radeditor to the height of the pane
var
paneHeight = $get(
"<%=paneBottom.ClientID %>"
).style.height;
alert(paneHeight);
editor.get_element().style.height = paneHeight;
}
The alert window that pops up for the pane height has nothing in it.
And here is the pane with the radeditor inside of it:
<radspl:RadPane runat=
"server"
ID=
"paneBottom"
Scrolling=
"none"
CssClass=
"RadEToolbar"
>
<radE:RadEditor runat=
"server"
ID=
"editor"
Width=
"100%"
EnableDocking=
"false"
Skin=
"Telerik"
ShowPreviewMode=
"false"
CssFiles=
"~/Css/public_page.css"
StripAbsoluteAnchorPaths=
"true"
StripAbsoluteImagesPaths=
"true"
AnchorPathToStrip=
"http://localhost:8080"
ImagesPathToStrip=
"http://localhost:8080"
ToolsFile=
"ToolsFile.xml"
OnClientLoad=
"OnClientLoad"
/>
</radspl:RadPane>
5 Answers, 1 is accepted
0
Hello,
Here is an example, which demonstrates how to get reference to parent element of RadEditor and apply this size to the RadEditor's div wrapper element and its content area:
Regards,
Rumen
the Telerik team
Here is an example, which demonstrates how to get reference to parent element of RadEditor and apply this size to the RadEditor's div wrapper element and its content area:
Copy Code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="TelerikTest.Default" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<
head
runat
=
"server"
>
<
title
></
title
>
<
style
type
=
"text/css"
>
html,body,form
{
margin:0;
padding:0;
height:100%;
overflow:hidden;
}
</
style
>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
telerik:RadScriptManager
ID
=
"ScriptManager1"
runat
=
"server"
>
</
telerik:RadScriptManager
>
<
telerik:RadSplitter
runat
=
"Server"
ID
=
"RadSplitter2"
Width
=
"100%"
BorderSize
=
"0"
BorderStyle
=
"None"
PanesBorderSize
=
"0"
Height
=
"100%"
Orientation
=
"Horizontal"
VisibleDuringInit
=
"true"
>
<
telerik:RadPane
ID
=
"topPaneMenu"
runat
=
"server"
Height
=
"50px"
>
</
telerik:RadPane
>
<
telerik:RadPane Height="400px"
runat
=
"server"
ID
=
"contentPane"
BackColor
=
"ActiveBorder"
>
<
telerik:RadEditor
runat
=
"server"
EditModes
=
"Design"
ID
=
"RadEditor1"
OnClientLoad
=
"OnClientLoad"
Width
=
"99%"
>
<
Modules
>
<
telerik:EditorModule
Visible
=
"false"
/>
</
Modules
>
</
telerik:RadEditor
>
<
script
type
=
"text/javascript"
>
function OnClientLoad(editor) {
setTimeout(function () {
$get("RAD_SPLITTER_PANE_CONTENT_contentPane").style.border = "1px solid red";
var paneHeight = $get("RAD_SPLITTER_PANE_CONTENT_contentPane").style.height;
editor.get_element().style.height = (parseInt(paneHeight) - 4) + "px";
editor.get_contentAreaElement().style.height = (parseInt(paneHeight) - 60) + "px";
}, 10);
}
</
script
>
</
telerik:RadPane
>
</
telerik:RadSplitter
>
</
form
>
</
body
>
</
html
>
Regards,
Rumen
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0

Ryan
Top achievements
Rank 1
answered on 11 Feb 2013, 03:12 PM
Thank you for the quick response.
I have already set the html, body, and form styles to the highlighted styles. The paneHeight is not being retreived properly.
I have changed my javascript to the following code:
But it only results in an additional invalid argument error on the bolded line. The alert window with paneHeight is still blank.
I have also tried changing the paneHeight to this:
var paneHeight = $get("RAD_SPLITTER_PANE_CONTENT_paneBottom").style.height;
But I get an error for that line: Unable to get value of the property 'style': object is null or undefined.
I have already set the html, body, and form styles to the highlighted styles. The paneHeight is not being retreived properly.
I have changed my javascript to the following code:
function
OnClientLoad(editor) {
//sets the height of the radeditor to the height of the pane
var
paneHeight = $get(
"<%=paneBottom.ClientID %>"
).style.height;
alert(paneHeight);
editor.get_element().style.height = (parseInt(paneHeight) - 4) +
"px"
;
editor.getContentAreaElement().style.height = (parseInt(paneHeight) - 60) +
"px"
;
}
But it only results in an additional invalid argument error on the bolded line. The alert window with paneHeight is still blank.
I have also tried changing the paneHeight to this:
var paneHeight = $get("RAD_SPLITTER_PANE_CONTENT_paneBottom").style.height;
But I get an error for that line: Unable to get value of the property 'style': object is null or undefined.
0
Hello,
Does this
If you see my example I am using the resolved panel ID taken from the page's HTML source.
but not
If you are unable to fix the problem, just open a support ticket and send a simple working project which demonstrates it. I will examine it and provide a solution.
Best regards,
Rumen
the Telerik team
Does this
$get(
"<%=paneBottom.ClientID %>"
)
code is resolved to the correct ID which gives a reference to the RadPane client object?If you see my example I am using the resolved panel ID taken from the page's HTML source.
$get("RAD_SPLITTER_PANE_CONTENT_contentPane")
but not
$get(
"<%=contentPane
.ClientID %>"
)
and this works on my end.If you are unable to fix the problem, just open a support ticket and send a simple working project which demonstrates it. I will examine it and provide a solution.
Best regards,
Rumen
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0

Ryan
Top achievements
Rank 1
answered on 15 Feb 2013, 01:32 PM
The server tag I used resolves to the following ID: ctl00_ContentPlaceHolder1_paneBottom
I looked in the source to find one more similar to what you had, and foud this : RAD_SPLITTER_PANE_CONTENT_ctl00_ContentPlaceHolder1_paneBottom
So I used it to get the paneheight:
But it only resolves to 331px. I will try to create a working project and submit a support ticket if you do not see anything obvious that is wrong here.
I looked in the source to find one more similar to what you had, and foud this : RAD_SPLITTER_PANE_CONTENT_ctl00_ContentPlaceHolder1_paneBottom
So I used it to get the paneheight:
function
OnClientLoad(editor) {
//sets the height of the radeditor to the height of the pane
//var paneHeight = $get("<%=paneBottom.ClientID %>").style.height;
var
paneHeight = $get(
"RAD_SPLITTER_PANE_CONTENT_ctl00_ContentPlaceHolder1_paneBottom"
).style.height;
alert(paneHeight);
editor.get_element().style.height = (parseInt(paneHeight) - 4) +
"px"
;
//editor.getContentAreaElement().style.height = (parseInt(paneHeight) - 60) + "px";
editor.get_element().style.height = paneHeight;
}
But it only resolves to 331px. I will try to create a working project and submit a support ticket if you do not see anything obvious that is wrong here.
0
Hello,
Yes, it is a good idea to isolate the problem in a sample working project so that we can debug it locally and see why the height is resolved to 331px.
Regards,
Rumen
the Telerik team
Yes, it is a good idea to isolate the problem in a sample working project so that we can debug it locally and see why the height is resolved to 331px.
Regards,
Rumen
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.