datatable in expander – misrendering

[Florian AuerParticipant]

Hi

I have a little issue with a jqxDataTable nested inside a jqxExpander, happening when the jqxDataTable gets its source asynchronously refreshed while the jqxExpander ist collapsed.

What happens is that the width for the jqxDataTable gets reduces to 100px insted of staying at 100%.

I created a jsFidle example to show the behaviour: http://jsfiddle.net/zLLgb33k/2/
Way to reproduce
1. click “load content” to fill the table
2. collapse the expander
3. click “load content” to simulate update
4. expand the expander –> broken display

The only way i found till now is to call the ‘render’ method of jqxExpander as result of its ‘expanded’ event.
But this causes unsuiteable flickering

Did i mess up something in the definition fpr these widgets?

[Peter StoevKeymaster]

Hello Florian,

See: http://jsfiddle.net/jqwidgets/QwLqr/ to learn how to create widgets in Expander.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[sreedParticipant]

I have about seven different jqxExpander.

Two of them contain contain a datatable.

Onload the column headers of the expander datatable display without any issues.

Once I collapse and expand the header columns of the datatable disappear.

If I continue to collapse and expand the same expander, sometimes they will display and sometimes they will not.

If I leave the datatable expander expanded and expand a different expander, then the column headers of the datatable appear.

The values of the datatable have no issues showing at all. Only the column headers of the datatable.

I have tried to use the initContent within the expander that uses the datatable, but no luck.

Thanks.

[sreedParticipant]

Also this only occurs in Chrome. IE and Firefox are fine

[sreedParticipant]

After working with the support team I was able to fix the problem by using:

$(‘#jqxWidgetExpander’).on(‘expanded’, function () { $(“#dataTable”).jqxDataTable(‘render’); });

Thanks jqwidgets support team.

[Author]

Posts