I believe that I have spotted a Javascript error in the console that is stopping AJAX results updating from working, or at least affecting them.
I can see these two errors:
Uncaught TypeError: $.ajax is not a function
and
Uncaught TypeError: n.find(...).fadeOut is not a function
How do I go about finding out what is causing this?
Hi, sometimes this is an indication that a theme or another plugin is enqueueing the jQuery library in a way that is not compatible with best practices. Can you try the following troubleshooting steps first?
- Temporarily deactivate all plugins except Types and Views, then activate a default theme like Twenty Seventeen.
- Test again. If the problem is resolved, reactivate your parent theme, then child theme, then other plugins one by one until the problem returns.
- If the problem was not resolved, check your site content to see if the jQuery library was added somewhere like a custom code snippet area. If so, that should be removed.
Let me know what you find out and we can go from there.
Thanks for your reply Christian.
I have followed these instructions, all plugins are fine but it seems to be the Child Theme that I am using that is causing the problem. There is no issue when I use the Parent Theme though, just the Child.
If this is something you can help me with then what are the next steps?
Another thought, is the jQuery library enqueued with Bootstrap 3 by default?
As I have deactivated that and I am enqueuing Bootstrap 4 directly currently. Maybe this could have something to do with it?
According to their documentation, jQuery is required for some of their JavaScript components but it's not included with the Bootstrap library and should be included separately: https://getbootstrap.com/docs/4.2/getting-started/introduction/
So depending on how your child theme is set up, it may have some code that includes a jQuery script tag directly in some template file, or perhaps it enqueues the script somehow in your functions.php file.
Troubleshooting child themes is outside the scope of support we provide here in the forums, per our support policy:
https://toolset.com/toolset-support-policy/
I will have a look at the Child Theme myself then. Thank you for the help you have already provided Christian.
One question though if that's ok. If I do not enqueue jQuery myself manually, and I set Toolset to not load Bootstrap, how does Toolset enqueue jQuery by itself to use AJAX?
jQuery is actually included with modern WordPress installations as a default: https://developer.wordpress.org/reference/functions/wp_enqueue_script/#defaults
It can be used as a dependency in wp_enqueue_script().
Thank you for all your help with this Christian.
Turns out I was enqueuing the slim build of jQuery which excludes AJAX. Started enqueuing the full build instead and all has been resolved.
