data table hides content when inside tab

[erikgmillerParticipant]

Hi I’ve got a strange problem, I have a set of tables and a datatable on each tab. I load them up by using a local array and the first time it loads they display properly. Now when i change the array and apply the changes to the tables, the one that is currently in view changes but when i goto the one on the next tab, the content is hidden. The header is there and the content is in the DOM but it does not display. I tried to rebind it by hooking into the ‘selecting’ tab event but the same result. Any ideas? (Code below, the bind is called when onchange is fired from a drop down and an array is passed in)

<div id=”dvDtmf”></div>

function bindDtmf(arDests) {
var src =
{
localdata: arDests,
dataType: “array”,
dataFields: [
{ name: ‘id’, type: ‘int’ },
{ name: ‘code’, type: ‘string’ },
{ name: ‘dest’, type: ‘string’ },
{ name: ‘ann’, type: ‘string’ }
]
};
var da = new $.jqx.dataAdapter(src);

$(“#dvDtmf”).jqxDataTable(
{
editable: true,
showToolbar: true,
theme: theme,
source: da,
columnsResize: true,
renderToolbar: renderDtmfToolBar,
columns: [
{ text: ‘Announcement’, dataField: ‘ann’, width: 100 },
{ text: ‘Code’, dataField: ‘code’, width: 100 },
{ text: ‘Destination’, dataField: ‘dest’, width: 180 }
]
});

}

[erikgmillerParticipant]

I did get it to work by calling the bind function from window.setTimeout. I’m still curious as to the cause of it though..

[Peter StoevKeymaster]

Hi erikgmiller,

You should implement the Tabs initTabContent function and dataTables should be created there.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts