Splitter - Page Loads Unformatted

[Joe]

When the page loads that has my Splitter on it, it shows up as un-formatted.  After a second or two, the page then changes to show the correct splitter panel layout.  How can I change this so that it doesn't show the un-formatted  splitter first?  See attached screen shots...

 

[Ianko]

Hello Joe,

Typically, that would happen if there are some runtime manipulations that lead to later initialization of the splitter scripts. 

With only the snapshot, however, I am unable to identify what exactly might be causing that. Here, with this  (http://demos.telerik.com/aspnet-mvc/splitter/index) the layout is loaded fine on page load. 

Can you provide some sample markup or a simple project demonstrating the case so that I can take a better look at the situation you have?

Regards,

Telerik by Progress

[Joe]

I do have a dropdown list populating via an Ajax call, as well as the data read for the panelbar, and also a separate ajax call that retrieves data to populate the middle panel with a form creation editor.  So I'm guessing the DB access initially to populate the components in the splitter is what is doing it.  I suppose I need to re-structure my page so the data reads all get called manually via javascript instead of letting them read on their own...  

[Neil]

I have the same issue. I have a PartialView that flashes on the screen in the left pane before every view renders with the left pane hidden.

Joe, Did you ever get it to work correctly?

[Joe]

Unfortunately no.  I've been re-considering using the Splitter at all since I can pretty much get the same functionality with some properly used divs and regular ole AJAX...

[Ianko]

Hello Neil and Joe,

Typically, using AJAX to load up Kendo Widgets should commonly be accomplished by making sure that the widgets are being resized using the resize method. 

When to use the resize method and in which scenario greatly depends on the layout of the application the DOM elements you are using in that layout.

Kendo widgets can get their wrapper elements' sizes and be able to redraw themselves properly. But with by rendering them using AJAX, there is no proper trigger that can possible be handled programmatically to properly render the widgets as per to the exact size of the layout. 

Regards,
Ianko
Telerik by Progress

[Joe]

If this were any other component, I would agree with you.  But when declaring the SPlitter, the sizes of the panels are set in the code.  The panel itself is not being populated via AJAX, and as such should not have a dynamic sizing to it.  When specifying the panels I want, I'm also specifying the sizes of the panels.  But it doesn't matter, the screen does not load that way at all until several seconds after it's loaded, and the components within the panels have done their data access.  IMO the splitter should most certainly not be dependent upon the contained components, especially if I'm declaring their sizes manually, which I am doing.

[Ianko]

Hello Joe,

Can you please provide a simple and locally runnable sample of the case you have on your end so that I can properly define the situation and the scenario you have? That way I would be able to properly investigate the behavior described. 

Regards,

Ianko
Telerik by Progress

[Joe]

Unfortunately not.  I have decided to not use the Splitter component, I don't have the time to fiddle fart around with it, nor do I have the time to come up with a working example to prove to you it's doing what it's doing. My application is large, and tryng to slice out just the bare minimum to get it to do what it's doing is not worth my time or effort.  I've just accepted that the Splitter component sucks, and will come up with an alternative. I hear good things about Infragistics... maybe I'll give them a chance.