Add dataTable Responsive label:Suggestion

Hi, It would be nice if you can add dataTable Responsive : https://datatables.net/extensions/responsive/ I have add it in my project and It’s a great render.

Also, a little fix for the search input field in mobile view : Add in css file this :

.form-control.input-sm {
    width: 100%;
}

It will prevent the field from overflow the block in mobile view.

Thank you for your great work 😉

[Nightbr]

@t0n1zz Hi, i used Bower to include the plugin : You need to add this to you bower.json or use the command bower install

    "datatables-responsive": "~1.0.4",
    "datatables": "~1.10.5",

After link css and js asset to your html page :

<link href="styles/vendor/AdminLTE/css/datatables/dataTables.bootstrap.css" rel="stylesheet" type="text/css" />
<link href="bower_components/datatables-responsive/css/dataTables.responsive.css" rel="stylesheet" type="text/css" />

<!-- boostrapdatatable -->
<script src="bower_components/datatables/media/js/jquery.dataTables.js"></script>
<script src="scripts/vendor/AdminLTE/plugins/datatables/dataTables.bootstrap.js" type="text/javascript"></script>
<script src="bower_components/datatables-responsive/js/dataTables.responsive.js"></script>

And finally, create a table and attach the behavior with jQuery :

$('.dataTable').DataTable({
                        responsive: true,
                        autoWidth: false
                    });

 <table class="table table-bordered table-striped dataTable">
<thead>
 <tr>
   <th>...</th>
</tr>
</thead>
<tbody>
        <tr>
               <td>....</td>
        </tr>
</tbody>
</table>

That’s it!! Enjoy your responsive DataTable!

[vaishnavkoka]

@Nightbr how did you add “is active”: active label of bootstrap in the datatable, can you just let me know?