Mobile Responsive without removing tr attribute include class and data-attr

Jerald16

Hello,

I am using DataTables Mobile Responsive, it work perfectly with display modal and renderer tableAll but after checking, the default class and attribute of tr are not included in the display of data. How can i add those attribute in my mobile responsive with modal view? Here's my code for the reference. I hope it will be have a solution. Thank you for advance and helping me.

<table id="wrapperList" class="table table-striped table-bordered table-responsive" cellspacing="0" width="100%">
    <tr class="view-data" data-attr="dataPostView">
        <td>Sample</td>
    </tr>
</table>


var dataTableList = $('#wrapperList').DataTable({
    deferRender: true,
    responsive: {
        details: {
            display: $.fn.dataTable.Responsive.display.modal(),
            renderer: $.fn.dataTable.Responsive.renderer.tableAll(),
        }
    }
});

colin

Hi @Jerald16 ,

Take a look at this example - it's for Bootstrap4 styling, so not entirely relevant, but you'll notice the rendering is adding classes. Is this something you could do for your table?

Cheers,

Colin

Jerald16

Hi @colin

Yes, it was that but in overall. I want also to get the value of data-attr in my TR element and rendered it in modal view responsive. It also different value of data-attr in each TR element of my default table. This class and attribute i want to get.

<tr class="view-data" data-attr="dataPostView">
        <td>Sample</td>
</tr>

Jerald16

Hello,

I got a little bit solution for this but not the best way, here's the code for your reference. If you have any idea to solve this in the best way, please feel free to comment here

mainTimer = setInterval(function(){
     dataTablePrinterList.rows().invalidate().draw();
},5000)