WebSplitter not sizing properly inside an UpdatePanel

1140

Wallace posted over 13 years ago

The WebSplitter is not filling 100% height when dropped into an UpdatePanel from Safari and Chrome (works fine in IE and Firefox). The UpdatePanel contains a Div panel set to 100% height/width and it is the parent of the WebSplitter. Here is the markup:

<ig:SplitterPane runat="server" Size="65%" ScrollBars="Hidden">
        <Template>
          <div class="AvrioModule100Percent">
            <asp:UpdatePanel ID="UpdatePanel1" runat="server" RenderMode="Inline">
              <ContentTemplate>
                <div class="AvrioModule100Percent">
                  <ig:WebSplitter ID="igSplitTree" runat="server" Orientation="Vertical" Width="100%"
                    Height="100%" DynamicResize="true" ResizeWithBrowser="True" Enabled="true" EnableAjaxViewState="true">
                    <Panes>
The stuff inside the splitter (i.e., the tree and associated grid, each in a separate pane
                    </Panes>
                  </ig:WebSplitter>
                </div>
              </ContentTemplate>
            </asp:UpdatePanel>
          </div>
        </Template>
      </ig:SplitterPane>

...

Any ideas as to what we need to do to get this to work properly in Chrome and Safari.

Parents

No Data

Reply

24497

[Infragistics] Viktor Snezhko posted over 13 years ago

Hi,

You may try to disable RenderMode=Inline. Most browsers do not support that attribute for DIV and SPAN and element gets collapsed.
Cancel
Reply

Cancel

Children

60

Gavin posted over 13 years ago in reply to [Infragistics] Viktor Snezhko

Hi I also have the same problem with the WebSplitter, although mine is not inside an update panel, its indside a Content control.

My mark up looks like this:

<asp:Content ID="ContentMain" ContentPlaceHolderID="MasterContentMain" runat="Server">

<div id="MainDivElement" style="padding: 5px; height: 100%;">

<%

-- WEB SPLITTER --%>

<ig1:WebSplitter ID="MainWebSplitter" runat="server" DynamicResize="true" Width="100%" ResizeWithBrowser="true" Height="100%">

***STUFF INSDE WEB SPLITTER HERE***

</ig1:WebSplitter>

</div>
</

asp:Content>

In IE8/9 and Firefox 4/5 it works correctly, but the latest Safari and Chrome all start with the height of the WebSplitter squished up to a really small height?? If I apply a fixed height to web splitter it will size accordingly, but not when set to 100%.

I've noticed a quirky side to this issue is that if I click on the splitter bar it will then magically draw itself to a full 100% of the browser, but not before? Can you please help me?

Thanks

Gavin
Cancel
Reply

Cancel