How to set css of dataTable after reload?

Question

There is a dataTable :

<table id="list_details_livraison" class="striped cell-hovered border bordered" data-searching="true">
                    <thead>
                        <tr>
                            <th style="text-align: center;"><?php echo _getText('detaillivraison.entete.article');?></th>
                            <th style="text-align: center;"><?php echo _getText('detaillivraison.entete.lot');?></th>
                            <th style="text-align: center;"><?php echo _getText('detaillivraison.entete.qtelivrer');?></th>
                            <th style="text-align: center;"><?php echo _getText('detaillivraison.entete.pu');?></th>
                            <th style="text-align: center;"><?php echo _getText('detaillivraison.entete.taxe');?></th>
                            <th style="text-align: center;"><?php echo _getText('detaillivraison.entete.remise');?></th>
                            <th style="text-align: center;"><?php echo _getText('detaillivraison.entete.prixtotal');?></th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>

$(document).ready(function(){
     var list_details_livraison = $('#list_details_livraison').DataTable({
           ...
           "initComplete": function(settings, json) {
                                    $(this).css("table-layout","fixed");
                                }
        });

Then I filter the dataTable by selecting a value from a select element :

$('#cacher').on("change", function() {
     var ddeb = convertDateFormat3($("#date_deb_").val());
     var dfin = convertDateFormat3($("#date_fin_").val());
     list_details_livraison.ajax.url("<?php echo RP_SSP; ?>server_processing_livraisons_frnsr.php?ddeb="+ddeb+"&dfin="+dfin+"&type="+$("#h_filtre_type_livraison").val()+"&valider="+$("#h_filtre_etre_valider").val()).load();
});

At runtime the dataTable's columns are not autowidth after I make the filter ; I tried using list_details_livraison.css("table-layout","fixed"); but I got a console error ! So how to reapply the table-layout fixed css at this moment ?

You probably need to use drawCallback as initComplete only runs once. — markpsmith
– markpsmith, Commented Dec 1, 2015 at 13:56

markpsmith · Accepted Answer · 2015-12-02 10:03:18Z

2

Comment converted into an answer at the request of the OP.

initComplete() will only run once per table creation, so won't be called after subsequent paging, filtering etc. For this you need drawCallback() which gets called after every draw.

You just need to change:

"initComplete": function(settings, json) {

to

"drawCallback": function( settings ) {

answered Dec 2, 2015 at 10:03

markpsmith

4,9182 gold badges38 silver badges65 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to set css of dataTable after reload?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related