Programmatic .expand() of collapsible results in zero height content

[David]

I have some collapsible widgets that I am "routing open" by way of a view().param switch on the view's "afterShow" event.

Basically, if a user clicks a nav link I am taking them to a different collapsible in that view. This all works well, however I may have a bug or some odd behavior on my hands.

If in my onAfterShow function I call:

$("#giving-collapse").data("kendoMobileCollapsible").expand();

...But I am left with a zero height .km-collapsible-content block:

<div data-role="collapsible-content" class="km-collapsible-content km-animated" style="height: 0px; display: block;"><div>

So I have called this after calling .expand() ...

$("#giving-collapse .km-collapsible-content").css("height","auto");

Which works and shows the proper content.

Am I missing something or should this work straight away without a defined height change?

[Alexander Valchev]

Hello David,

I tried to reproduce the scenario in a sample page but to no avail.
Could you please check my example and let me know what I am missing?

• http://dojo.telerik.com/@valchev/IFiCO

Looking forward to your reply.

Regards,
Alexander Valchev
Telerik

 

 

[David]

It appears it's a dynamic content issue of some sort. My usage always has content that is loaded by way of ajax calls upon the opening of the collapsible. So I guess the data isn't loaded yet. But even when it is loaded the height is still set to the initial value of 0. Is there a way to prevent the default opening until the data is done loading?

[Alexander Valchev]

Hi David,

By default the widget is collapsed.

• http://docs.telerik.com/kendo-ui/api/javascript/mobile/ui/collapsible#configuration-collapsed

Please try to call the expand method after the content is loaded.

Regards,
Alexander Valchev
Telerik

 

 

[David]

Yeah, I guess my problem is I need to populate the widget's content with new data on every "expand" or at least check for new data... It's working as it is, however there is a bit of a jerkiness to the expansion because of this. I'm not sure of a way around it.

[Alexander Valchev]

Hi David,

You may use kendoWidgetCreated event.

Regards,
Alexander Valchev
Telerik

 

 

[David]

I'm not sure that is a valid solution as the behavior that I am looking for is reacting to the user input of wanting to open that specific collapsible section. Its equatable to clicking a different tab in the Tab Strip and requesting new content with that action.

[Alexander Valchev]

Hello David,

My previous reply (from 20-Apr-2015) was intended for other support thread. Please accept my apology for the mistake.

You may try to call the resize method of the Collapsible widget to force re-calculation of the content height. Method should be called after widget is opened and the content is changed.

Regards,
Alexander Valchev
Telerik

 

 

[David]

Thanks for the clarification.

Just an FYI... There isn't a reference to this method in the collapsible widget documentation "methods" list... But that seems to do the trick!

[Alexander Valchev]

Hi David,

Thank you for the feedback, I documented the method. The changes should be published live soon.

Regards,
Alexander Valchev
Telerik