SearchPanes: Why am I getting "Uncaught TypeError: Cannot read property 'fn' of undefined"?
SearchPanes: Why am I getting "Uncaught TypeError: Cannot read property 'fn' of undefined"?

Getting this message when page loading:
* "Uncaught TypeError: Cannot read property 'fn' of undefined"
* at dataTables.searchPanes.min.js?ver=5.3.2:23
* at dataTables.searchPanes.min.js?ver=5.3.2:86
Seems to be throwing the error around: "var b=$.fn.dataTable..."
Table is being displayed but no 'panes' just the errors as above.
I'm using dataTables in a WordPress environment - where all is working fine including with several other extensions.
I'm pulling in the CDN files as per docs:
wp_enqueue_script('datatablessearchpanes', 'https://cdn.datatables.net/searchpanes/1.0.1/js/dataTables.searchPanes.min.js');
wp_enqueue_style('datatablessearchpanes', 'https://cdn.datatables.net/searchpanes/1.0.1/css/searchPanes.dataTables.min.css');
My dom setting: 'Pfrtp'
My hunch is this is something to do with loading jquery (conflict with WP!?) but if that's the case why is it all fine with other extensions (select, buttons, responsive) and dataTables in general?
Most grateful for any pointers on how to resolve!
Debug code: ekokaw
Answers
It would be worth trying with the nightly releases, as there have been some changes. You can find the nightly releases here.
If still no joy, we're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.
Cheers,
Colin
OK, I've tried the nightly releases in PROD but no change! I've reproduced the settings in a test case as you suggest but that's all working. It seems to confirm that it's something to do with the WordPress run-time environment.
I can't provide link to PROD but will try and build a publicly-available test page if that will help!?
Please, yep, without seeing the issue fail it's hard to diagnose it.
Colin
I have built a minimal WordPress (latest version 5.4 with latest default WP theme) site to demo the issue with the SearchPanes extension - as above. The URL is: http://sandpit01.wpengine.com/datatables/
The site is password protected (for now): demo/bc6322cb814b
I have used the basic settings as per the docs example.
PS My guess is that the version of jQuery used by even the very latest version of WP is too old but it is a pain to change / override it.
I just tried it here, with the same sources, and it's behaving as expected - so something odd going on. We'll have a think and get back to you.
Colin
Hi @princerupert
We've fixed the issue and it looks like it is now working on your page.
The root of the problem was the call to
jQuery.noConflict()
, we have put a mechanism in place to cope with this. The fix is available in the nightly builds, as you are currently using, and will be available in the next release.Hope this helps,
Sandy
Great. Many thanks
Hi @sandy Can you pls advise when we can expect this fix to be deployed?
@princerupert We expect the next release to be within the next few weeks and it's available in the nightly builds currently.
Thanks,
Sandy