SearchPanes nightly build ignores config and language

pgerundt

Link to test case:
http://live.datatables.net/fesolapo/2/edit

Description of problem:
When using the nightly build of search panes, the button changes from "SearchPanes" to the text "MY BUTTON TEXT" given in the config only after you click on it.
Additionally (only occurs in my local installation), the config setting layout: columns-4 is ignored when using the nightly build.

Greetings,
Pascal

allan

HI Pascal,

Thanks for letting me know about the button initialisation error. I've committed a fix for that and the new nightly has that fix in it.

For the columns-4 issue - I'm not seeing that either locally or in the example given. The JSBin example is narrow by default, so the view gets collapsed down. But when the output is widened we can see that columns-4 is applied.

You mentioned that it only happens in your local install - can you give a link to that page?

Allan

pgerundt

Hi Allan,

the columns-4 issue only occurs in the Bootstrap4 version - several Bootstrap classes are no longer set.
To trace the bug, we had to update DataTables from 1.11.4 to 1.12.1 (now having a fancy processing indicator).
After updating the nightly build of SearchPanes (Bootstrap4), our webpack compiler breaks with an error message:
ERROR in [...]/searchPanes.bootstrap4.js Module not found: Error: Empty dependency (no request) webpack compiled with 1 error

We eventually traced the error down to line 8 of
https://nightly.datatables.net/buttons/js/buttons.bootstrap4.js
define( [''], function ( $ ) {

Changing this to
define( [], function ( $ ) {
makes webpack work again but results in another error message.

So to sum it up:
There might an issue with a current DataTables version and the nightly build of SearchPanes with both using Bootstrap4.
But we cannot trace it due to the Webpack compile error.

pgerundt

Hi @allan ,

we finally found the bug(s)!

Description:
- SearchPanes config settings (such as layout or initCollapsed) are ignored when using the nightly build of SearchPanes
https://nightly.datatables.net/searchpanes/js/dataTables.searchPanes.js
- Webpack compile error when using the nightly build of SearchPanes-BS4
https://nightly.datatables.net/searchpanes/js/searchPanes.bootstrap4.js

Test cases:
- With SearchPanes 2.0.2, columns-4 works:
http://live.datatables.net/cigusizo/4/edit
- With SearchPanes nightly build, config is ignored:
http://live.datatables.net/cigusizo/7/edit

Side note:
The nightly build page
https://datatables.net/download/nightly
does not show the BS4 versions for Select and SearchPanes when the Bootstrap4 button is activated.

allan

Many thanks for this - I will dig into this more and get back to you shortly.

Allan

pgerundt

Hi @allan,

I think, I can help you with this. I guess the nightly build shows the desired behaviour and it is just necessary to add the config again:

http://live.datatables.net/cigusizo/8/edit

Am I right?

Cheers,
Pascal

pgerundt

I was wrong, the nightly build of SearchPanes has a lot of other issues.

If you select a filter e.g., the button text is no longer updated to "Filter (1)":
http://live.datatables.net/cigusizo/12/edit

Works fine with SearchPanes 2.0.2

allan

Hi Pascal,

I've just been looking into this and I think the bug was that it should never have worked! What you are doing is replacing the instance of SearchPanes that searchPanes is creating with your own. The one that is created is never displayed and the event handlers are on that one which is never displayed, so the button text is never updated! The has a performance penalty as well since there are two instances of SearchPanes on the page.

The second SearchPanes instance knows nothing about the button that triggers it's display. So to reiterate, although this worked before - that it did was a bug!

I presume that you are doing it this way so be able to slide / animate the SearchPanes into view rather than using the fade effect from the button?

If so, what I would suggest doing is basically creating your own custom button. You already have 95% of the required code for that, we just need to put it into a buttons.buttons.init call and then update things a little to use the i18n() method to get your language strings.

I've done that here. It visually shows the same as before, but it will be faster and I think work the way you want.

Regards,
Allan

pgerundt

Hi @allan

Thank you very much, this works great and is much faster.
I found the suggestion to create a new SearchPanes instances somewhere in the forum, I always thought that this is not the best way to do...

Case closed.

Thanks,
Pascal