RadEditor Height with Content will not Resize

3 posts, 0 answers
  1. Rengo
    Rengo avatar
    25 posts
    Member since:
    Nov 2012

    Posted 25 Mar 2013 Link to this post


    I am able to dynamically create and resize the RadEditor within a RadGrid with the code listed below.  Although, if any of the previous RadEditors contain content they will not resize to the specified height of 25px, when dynamically adding a new instance of the RadEditor in the RadGrid.


     <script type="text/javascript">
             function OnClientLoad(editor) {

                 /* Increase height of Instruction Editor */
                 editor.attachEventHandler("onfocus", function (e) {
                     editor.setSize("225", "200");
                 /* Reset to default height of Instruction Editor */
                 editor.attachEventHandler("blur", function (e) {
                     editor.setSize("225", "25");
        <style type="text/css">
            white-space: pre-line !important;
            word-wrap: break-word !important;
            max-width: 200px;
            text-align: left;

     <telerik:GridTemplateColumn HeaderText="Instructions" UniqueName="Instructions" HeaderStyle-HorizontalAlign="Center" ItemStyle-Wrap="false">
                        <telerik:RadEditor ID="txtInstruction" runat="server" MaxTextLength="1000" Style="overflow:auto; overflow-x: hidden; overflow-y: scroll;" AutoResizeHeight="true" EditModes="Design" ContentAreaMode="Div" ToolbarMode="Default" OnClientLoad="OnClientLoad" Width="220px" Height="25px" ToolsWidth="130px">
                                <telerik:EditorTool  Name="ForeColor" />
                                <telerik:EditorTool Name="Bold" />
                                <telerik:EditorTool Name="Italic" />
                                <telerik:EditorTool Name="Underline" />

    How do I dynamically collaps2 all previous RadEditors, that contain content, to 25px when creating a new RadEditor row within the RadGrid?

    Thank You in Advance!
  2. Rumen
    Rumen avatar
    14280 posts

    Posted 28 Mar 2013 Link to this post


    Your custom scenario is not supported out-of-the box. Could you please explain your scenario in more detail so that we can see whether it is possible to implement such a solution? Please, also try to isolate it in a simple working project and send it for examination via a support ticket.

    Do you add the new item on the client or on the server? Does the text in the editors come from the DB or it is entered or pasted by the end user? Will the text be saved to the database? Do you create a new item for each new editor in the Database?

    Basically, RadGrid offers an interface to work with the data of a datasource, but not the ability to create and modify the interface. What you are trying to create is exactly the opposite.
    If you want to add new grid items and in the DataSource, please see this live demo: RadGrid Edit Template.

    If you apply a command to the Add Instructions button, you can use the OnCommand client-side event of RadGrid to check the page for the available editors and collapse (decrease their height) them. You can learn how to get reference to the editors available on the page in this article: How-to create a javascript array of all particular RadControls on the page.

    Best regards,
    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.
  3. Rengo
    Rengo avatar
    25 posts
    Member since:
    Nov 2012

    Posted 28 Mar 2013 Link to this post

    Hello Rumen,

    Thank you for the follow-up.

    We did notice that this functionality is not available out-of-the-box and we have implemented a different solution.

    Thank You!
Back to Top