I have no idea how this is happening, but when I try to set the default panel to open using class='k-state-active' the page loads and then the page loads again inside the open panel.
The HTML:
<
ul
id
=
"strategyPanels"
>
<
li
class
=
"k-state-active"
>Asset Class Allocator
<
div
id
=
"assetClassAllocator"
></
div
>
</
li
>
<
li
>Fund Allocator
<
div
>investment fund stuff</
div
>
</
li
>
<
li
>Cost Calculator
<
div
>cost calculator</
div
>
</
li
>
</
ul
>
and the script:
$(
'#strategyPanels'
).kendoPanelBar();
There is more JavaScript initializing a Kendo Grid using the assetClassAllocator DIV.
Note: If I set the second panel as active it works fine:
<
ul
id
=
"strategyPanels"
>
<
li
>Asset Class Allocator
<
div
id
=
"assetClassAllocator"
></
div
>
</
li
>
<
li
class
=
"k-state-active"
>Fund Allocator
<
div
>investment fund stuff</
div
>
</
li
>
<
li
>Cost Calculator
<
div
>cost calculator</
div
>
</
li
>
</
ul
>
Same goes for the third panel.
Another Option:
I've even tried doing this directly via JavaScript, but it does the same thing.
//setup panel bars
$(
'#strategyPanels'
).kendoPanelBar();
var
panelBar = $(
'#strategyPanels'
).data(
'kendoPanelBar'
);
panelBar.expand($(
'#strategyPanels li:first-child'
));
So it would seem that this has something to do with the Kendo Grid in the first panel.
What potential issues could cause the panel bar to behave like this?
Regards,
Jacques