RadEditor Design, HTML, Preview buttons are disappearing

[Eric Moreau]

Hi

I have posted this question but I think it was in the wrong forum (http://www.telerik.com/community/forums/aspnet/editor/radeditor-design-html-preview-buttons-are-disappearing.aspx).

I use RadEditor from Telerik.Web.UI.dll version 2009.1.402.35.

I have a simple page containing a RadTabStrip. Two of the RadPageView contains a RadEditor. This page is displayed into a RadWindow.

I have made a sample of my problem (I could send it if you give me a e-mail address). The code is also in the original question.

The problem I have is that when I press one of the DESIGN, PREVIEW, or HTML button, the RadEditor resizes and I don't see those 3 buttons anymore.

I want the RadEditor to fully fill the tab. And I want the tab to fully fill the Window.

What can I do?

[Rumen]

Hello Eric Moreau,

I was able to fix the problem by attaching to the OnClientModeChange event property of RadEditor and setting a smaller height to the editor's IFRAME and wrapper element:

function OnClientModeChange(editor)
{
    if (editor.get_mode() == 2 || editor.get_mode() == 4)
    {

        setTimeout(function()
        {
            document.getElementById( editor.get_id() + "Wrapper").style.height = "80%";
            editor.get_element().getElementsByTagName("IFRAME")[1].style.height = "100%";

        }, 100);
    }
}

For your convenience I have attached the modified EditPage.aspx.

Our RadEditor lead developer is currently fixing problems that apply to full screen mode and it is possible that this bug will not exist in the next major version.

I also deleted your other forum post on the subject.

Greetings,
Rumen
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Eric Moreau]

for those who are interested, I have opened a ticket and got a "workaround" answer.

I was able to achieve the desired behavior by setting the editor's width property to 100% and attaching the following function

<script type="text/javascript" >
   function onTabSelected(sender, args)
   {
        var selectedTab = args.get_tab().get_text();

        var editor1 = $find("<%=txtDescriptionEn.ClientID%>");
        var editor2 = $find("<%=txtDescriptionFr.ClientID%>");
        var documentHeightFix = "90";
        var documentHeight = document.documentElement.offsetHeight - documentHeightFix;

        if(selectedTab == "English Text")
        {
                editor1.setSize(editor1.get_element().style.width, documentHeight);
        }
        else if (selectedTab == "French Text")
        {
               editor2.setSize(editor2.get_element().style.width, documentHeight);
        }
   }
</script>

to the OnClientTabSelected property of RadTabStrip.