Scroller causes problem to get data from ajax source
Scroller causes problem to get data from ajax source
Hello,
I try to put Datatable with Scroller into Bootstrap tab, which is not active. Datatable uses php-script to get data from database. When I try to open tab with Datatable, I see "No matching records found". Firebug sais: {"draw":1,"recordsTotal":5008,"recordsFiltered":5008,"data":[]}. But if I remove scroller from Datatable, all works perfectly.What am I doing wrong?
<script type="text/javascript" language="javascript" class="init">
$(document).ready(function() {              
        var table = $('#supply').dataTable( {
        "scrollX":          true,
        "sScrollX":         "100%",
        "sScrollXInner":    "120%",
        "columns":          [
                                { "width": "3%" },
                                null,
                                null,
                                null,
                                null,
                                null
                            ],
        "processing":       true,
        "serverSide":       true,
        "ajax":             "server_processing.php",
        deferRender:        true,
        scrollY:            $(document).height() - 500,
        scrollCollapse:     true,
    } );
    new $.fn.dataTable.FixedColumns( table, {
        leftColumns: 1,
        rightColumns: 1,
    } );
    $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
        $('#supply:visible').each( function(e) {
            //alert('visible ' + $(this).attr('id'));
            $(this).dataTable().fnAdjustColumnSizing();
        });
    });
} );
</script>
This discussion has been closed.
            
Answers
I have the same problem, when i add the scrollX: true, the data in my table desapears