jdilleen / datatables-bulma Goto Github PK

When clicking on the ellipsis (even when it's disabled, it's a link), you receive the following error: DataTables warning: table id=DataTables_Table_0 - Unknown paging action: ellipsis.

This can be fixed by preventing ellipsis from being pased to the draw function by adding this filter a.data.action !== 'ellipsis'.

I wanted to issue a PR, but there are no build instructions on how to create the minimized JS file. Here is a working diff on the main JS.

diff --git a/js/dataTables.bulma.js b/js/dataTables.bulma.js
index 963c359..85ebbe9 100644
--- a/js/dataTables.bulma.js
+++ b/js/dataTables.bulma.js
@@ -31,7 +31,7 @@
       q = function(d, f) {
         var l, h, i, c, m = function(a) {
           a.preventDefault();
-          (!b(a.currentTarget).is("[disabled]") && !b(a.currentTarget).is("#table_ellipsis")) && o.page() != a.data.action && o.page(a.data.action).draw("page")
+          (!b(a.currentTarget).is("[disabled]") && !b(a.currentTarget).is("#table_ellipsis")) && (a.data.action !== 'ellipsis') && o.page() != a.data.action && o.page(a.data.action).draw("page")
         };
         l = 0;
         for (h = f.length; l < h; l++)

Someone already figured out how to show the icons when loading FA icons with their SVG + JS framework?

Followed the instructions here but didn't work so far.

I assume it may be related to the fact that the tables are being generated dynamically?

The "is-disabled" CSS class has been deprecated in favor of the disabled HTML attribute per the Bulma docs. More info. Using dataTables.bulma.js allows the user to click on the ellipsis when available and there's nowhere for them to go, resulting in this error.

I believe the fix is to remove any appended "is-disabled" classes and add the disabled property where appropriate. My JS skills are severely lacking so I wasn't able to figure out how to do this myself.

Hi, Sir, I have tried using your library to my own project but it cannot come out the searching, pagination, filtering and sorting function. May I know how to do with it? Thank you.

When using dataTables.bulma.css there are two sets of sorting icons shown in the table header, one from Font Awesome and the other I'm guessing from DataTables. If I comment out lines 51, 55, and 59 the issue goes away.

Fyi, the example in the README doesn't work (anymore):

https://camo.githubusercontent.com/9b750f46a1528bc5f2a65698f4ca195b85d94b7d/68747470733a2f2f6a64696c6c65656e2e6d652f696e636c756465732f696d672f62756c6d612e706e67

When going into touch or below responsiveness, the pagination goes outside of the box that the table is wrapped in.

Then, I tried wrapping the table in table-responsive, but now the table always has a scroll-x bar no matter what width the window is.

This package is last published to npm 3 years ago https://www.npmjs.com/package/datatables-bulma