I have created a Toolset archive with the Block editor where I have added a few search filters, a search button and a Clear All Filter button. The Archive shows search result with ajax. I have also added a jQuery code for custom functionality on the frontend. But the jQuery code isn't working after pressing the Clear All Filter button. How can I fix it?
Looking forward to your help. Thanks.
Hi,
Thank you for contacting us and I'd be happy to assist.
Usually, the custom script is structured so that it is executed/initiated, when the page's loading completes ('ready' event). For example:
jQuery(document).ready(function( $ ) {
// some custom code
});
But when the search results are set to be updated through the AJAX, you'll need to write your custom script, so that it re-initiates, for additional events like 'js_event_wpv_pagination_completed', 'js_event_wpv_parametric_search_form_updated', and 'js_event_wpv_parametric_search_results_updated' too. For example:
(function($) {
$( document ).on( 'ready js_event_wpv_pagination_completed js_event_wpv_parametric_search_form_updated js_event_wpv_parametric_search_results_updated', function( event, data ) {
// some custom code
});
});
I hope this helps and please let me know if you need further assistance.
regards,
Waqar
Hi, thanks for the answer. From your answer, I understood that the search form is getting updated which is causing the problem. Is there any way to stop updating the search form so that jQuery can work?
Thanks for writing back.
In the 'WordPress Archive Search' block, if the 'AJAX refresh when changing any filter' option and the 'Show only filter options that would produce results' options are turned on, then the search form will update through AJAX, every time any search field's option is changed.
So with these AJAX options turned on, you'll have to structure your custom script to initialize with the relevant events too, as explained in my last reply.
Hi, thanks for the reply.
In my archive, 'AJAX refresh when changing any filter' option is turned on and the 'Show only filter options that would produce results' options is turned off. So after I click on Search button, the jQuery code works. But after clicking on Clear All Filter button, the jQuery code doesn't work. So the jQuery code is still updating I guess. Is there any way to fix it?
To troubleshoot this, I'll need to see how this archive and the custom script are set up in the admin area.
Can you please share temporary admin login details, along with the link to the archive page?
Note: Your next reply will be private and making a complete backup copy is recommended before sharing the access details.
My issue is resolved now. Thank you!