jqxsplitter throws exception since update from 2.7 to 2.8

[SkippingAdiParticipant]

Hi all

I just updated from jqwidgets 2.7 to version 2.8. Now my webproject shows the following excpetion:

Invalid HTML Structure! Nested jqxSplitter cannot be initialized from a Splitter Panel. You need to add a new DIV tag inside the Splitter Panel and initialize the nested jqxSplitter from it!

With version 2.7 everything worked fine!

Here my html structure:

<div id=”mainSplitter”>
<div class=”splitter-panel” id=”rightContainer”>
<div class=”splitter-pane” style=”overflow-x: auto;” id=”northContainer”>
<span class=”panel-content”>North</span>
…
<div id=”NewPonyPopUp” class=”Hidden”></div>
<div id=”jqwindow”>
<div id=”windowHeader”>
</div>
<div style=”overflow: hidden;” id=”windowContent”>
</div>
</div>
</div>
<div class=”splitter-panel” id=”southContainer”>
<div class=”splitter-panel” id=”westContainer”>
<span class=”panel-content” style=”overflow-x: auto;”>west</span>
<div id=”jqxTree”>
<ul>
<li style=”width: 500px; background-color: red;”>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
</ul>
</div>
</div>
<div class=”splitter-panel” style=”overflow: auto;” id=”centerContainer”>
<span class=”panel-content”>center</span>
<div id=”Beurteilung”>
…</div>
</div>
</div>
</div>
<div class=”splitter-panel” id=”leftContaienr”>
<span class=”panel-content”>East</span>
</div>
</div>

These the lines i used to configure the splitters:

$(‘#mainSplitter’).jqxSplitter({ width: 960, height: 600, theme: theme, panels: [{ max: ‘960px’, size: 700, collapsible: false }, { size: 260 }] });

$(‘#rightContainer’).jqxSplitter({ theme: theme, orientation: ‘horizontal’, panels: [{ size: 200, collapsible: false }, { size: 400 }] });

$(‘#southContainer’).jqxSplitter({ theme: theme, panels: [{ size: 150 }, { size: 550, collapsible: false }] });

In debugmode I see that the conten of: this.element.className.indexOf(“jqx-splitter-panel”)!=-1) is = splitter-panel jqx-widget-content jqx-widget-content-ui-le-frog jqx-splitter-panel jqx-splitter-panel-ui-le-frog jqx-reset jqx-reset-ui-le-frog”. It seems as the text jqx-splitter-panle occurs twice!?

 Can anybody help me?
Thanks
Adrian

[Peter StoevKeymaster]

Hi Adrian,

I think the error message is self emplaining: “Invalid HTML Structure! Nested jqxSplitter cannot be initialized from a Splitter Panel. You need to add a new DIV tag inside the Splitter Panel and initialize the nested jqxSplitter from it!”

You may find the documentation about the breaking changes here: releasehistory.htm

The splitter in ver. 2.8 is re-engineered.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[SkippingAdiParticipant]

Hi Peter,
Sorry but I’m unable to see where the difference is between my html structure and the ones in your examples?

Adrian

[Peter StoevKeymaster]

Hi Adrian,

In our samples, we do not initialize a Splitter from the Panel of another Splitter. That is marked as a breaking change in ver. 2.8 and is marked as such in the release history.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[SkippingAdiParticipant]

Ok, thanks for clarification.
I was able to get it run.

One more question:
The panels property of the splitter is not a jqxPanel, right?

Adrian

[robrichardMember]

SkippingAdi:

What did you do to fix this issue???

[robrichardMember]

Ah, got it… Wrap each section inside of the splitters with a blank DIV. That would have been a more appropriate error message…

[Author]

Posts