Datatables with AdminLTE theme

xdavidt

Link to test case: https://adminlte.io/themes/dev/AdminLTE/pages/tables/data.html
I start use Angular Datatables: https://l-lin.github.io/angular-datatables
It's just fork, and same using.
I try to use Datatables with my project and use the AdminLTE theme, but after saw the page search is broken, look again and made small research.
I found the AdminLTE is using <ul> to manage all pages, and each page is under tag of <li>.
When Datatables is working under <span> without any special tags.
Is there any way to cover my paging with this tags ?

kthorngren

but after saw the page search is broken,

Are you referring to the search input at the top of the page? Not sure what that search is supposed to do but its not for Datatables.

The second example has the Datatables search input and it works. The Datatables are initialized like this:

    $("#example1").DataTable();
    $('#example2').DataTable({
      "paging": true,
      "lengthChange": false,
      "searching": false,
      "ordering": true,
      "info": true,
      "autoWidth": false,
    });

example2 is the top table and it does not have the Datatables search because of the searching option being disabled.

Kevin

xdavidt

No, the search isn't the issue.
Please review that screenshot: https://imgur.com/a/i0WPsfO
The pages is coverd by ul and li

kthorngren

The page is using Bootstrap4 styling. Here is the Datatables example with BS4 styling. You will find the same use of ul and li elements.

Sorry, I don't understand the problem or what you are wanting to change.

Kevin

xdavidt

OK, found the main issue, I was missing one libary:

dataTables.bootstrap4.js