Using bScrollInfinite: true causes the sEmptyTable message to display incorrectly
Using bScrollInfinite: true causes the sEmptyTable message to display incorrectly
greengrass
Posts: 3Questions: 0Answers: 0
When initializing a table with
[code]bScrollInfinite: true[/code]
then using fnAddData to add several records, then the sEmptyTable message will not disappear after data is added, but will instead display multiple times on top of the data that is added to the table.
Example table construction:
[code]
$("#sample").dataTable({
bJQueryUI: true
, aaSorting: [[0, 'desc']]
, bFilter: false
, bAutoWidth: true
, bScrollInfinite: true
, iDisplayLength: spsUtilities.INFINITE_SCROLL_CHUNK
, sScrollY: "250"
, bScrollCollapse: true
, sScrollX: "100%"
, sScrollXInner: "160%"
, aoColumns: [ { } //add
,{ } //required date
,{sWidth: '23em', sClass: 'materialColumn' } //material
,{sWidth: '6em', sClass: 'rightTxt editQuantity'} //qty/ea
,{sWidth: '4em', sClass: 'rightTxt' } //Bnd
,{sWidth: '6em', sClass: 'rightTxt' } //Weight
,{sWidth: '7em', sClass: 'rightTxt' } //$/CWT
,{sWidth: '7em', sClass: 'rightTxt' } //Net Value
,{ } //Status
,{sWidth: '3em', sClass: 'deleteColumn', bSortable:false } //reject
,{} //Shipping conditions
,{ } //document/line
,{ } //mill (valuation type)
]
, oLanguage: {
"sEmptyTable": "No records",
"sInfo": "Open quotes: _TOTAL_ records",
"sInfoEmpty": ""
}
});
[/code]
I also do not use fnDraw to redraw the table, but instead I use
[code]fnAdjustColumnSizing()[/code]
[code]bScrollInfinite: true[/code]
then using fnAddData to add several records, then the sEmptyTable message will not disappear after data is added, but will instead display multiple times on top of the data that is added to the table.
Example table construction:
[code]
$("#sample").dataTable({
bJQueryUI: true
, aaSorting: [[0, 'desc']]
, bFilter: false
, bAutoWidth: true
, bScrollInfinite: true
, iDisplayLength: spsUtilities.INFINITE_SCROLL_CHUNK
, sScrollY: "250"
, bScrollCollapse: true
, sScrollX: "100%"
, sScrollXInner: "160%"
, aoColumns: [ { } //add
,{ } //required date
,{sWidth: '23em', sClass: 'materialColumn' } //material
,{sWidth: '6em', sClass: 'rightTxt editQuantity'} //qty/ea
,{sWidth: '4em', sClass: 'rightTxt' } //Bnd
,{sWidth: '6em', sClass: 'rightTxt' } //Weight
,{sWidth: '7em', sClass: 'rightTxt' } //$/CWT
,{sWidth: '7em', sClass: 'rightTxt' } //Net Value
,{ } //Status
,{sWidth: '3em', sClass: 'deleteColumn', bSortable:false } //reject
,{} //Shipping conditions
,{ } //document/line
,{ } //mill (valuation type)
]
, oLanguage: {
"sEmptyTable": "No records",
"sInfo": "Open quotes: _TOTAL_ records",
"sInfoEmpty": ""
}
});
[/code]
I also do not use fnDraw to redraw the table, but instead I use
[code]fnAdjustColumnSizing()[/code]
This discussion has been closed.
Replies
Allan
[code]
$(document).ready(function() {
var t = $('#example').dataTable( {
bScrollInfinite: true,
sScrollY: 300,
bScrollCollapse: true
} );
t.fnAddData( [1,2,3,4,5], false );
t.fnAdjustColumnSizing();
} );
[/code]
Having said that - there is most certainly something wrong with DataTables here since it is showing both the loading string and the new record - I would expect it to show only the loading since without a redraw. Added to my list to look at :-)
Regards,
Allan
To clarify, I was trying to optimize for speed when adding multiple rows by not having datatables redraw until after all new rows were added.
fnAdjustColumnSizing() redraws the table by default, so I thought I was ok in deferring redraws until this function was called, but it sounds like I may have misunderstood the redrawing mechanism.