[Solved] Splitter does not decrease with Telerik editor

[SUNG]

I have a splitter and left panel is an editor.

I can increase editor panel, but can not decrease. Also mouse point seems going somewhere else when I'm trying to decrease the panel.

How can I resolve this issue?

@{Html.Telerik().Splitter().Name("page-edit-splitter")

                .HtmlAttributes(new { style = "height: 750px;" })

                .Orientation(SplitterOrientation.Horizontal)

                .Panes(panes =>

                {

                    panes.Add()

                        .HtmlAttributes( new { id="splitter-left"})

                        .Size("50%")

                        .MinSize("500px")

                        .Content(@<div id="edit-container">

contents

                            </div>);

                    panes.Add()

                        .Size("50%")

                        .MinSize("130px")

                        .Content(@<div id="preview-container">

                             contents.

                        </div>);

                })

                .Render();

            }


Left panel. partial view contents (ajax load)

<div class="text-editor">
    @{Html.Telerik().Editor()
        .Name("ContentText")
        .HtmlAttributes(new { style = "height:500px;width:100%" })
        .Encode(false)
        .Value(@Model.ContentText)
        .Render();
    }
</div>

- Telerik MVC 3 UI Extension v.2011.2.914.340
- IE9, Chrome, FF7.0.1

[Dimo]

Hello Sung,

The problem is caused by the fact that the IFRAME inside the Editor does not bubble mouse event to the containing page. The resolution is to overlay the Editor iframe with some element while resizing the Splitter. Sample code to achieve the desired behavior is shown here:

http://www.telerik.com/community/forums/aspnet-mvc/editor/editor-height-100-inside-splitter-panel.aspx#1806322

Greetings,
Dimo
the Telerik team