Aleš Sýkora wrote

Trigger js event after ajax finished

2. 7. 2019 in

There’s a way to trigger a javascript callback after ajax event. The way how to do that is easy.

You just need to go to your View ‘s filter section and open the JS box.
Click on button called Frontend events. And select which Ajax event you are looking for.

Frontend events in Views
Frontend events integrated in Views Filter JS box

You have this options:

  • The AJAX pagination has been completed
  • The custom search has been triggered
  • The custom search data has been collected
  • The custom search form has been updated
  • The custom search results have been updated

Select the one you need. Toolset Views will automatically create the jQuery for you and you just need to add the body of event.

Automatically created event in Toolset Views Filter

Event codes:

The AJAX Pagination has been completed

jQuery( document ).on( 'js_event_wpv_pagination_completed', function( event, data ) {
	/**
	* data.view_unique_id (string) The View unique ID hash
	* data.effect (string) The View AJAX pagination effect
	* data.speed (integer) The View AJAX pagination speed in miliseconds
	* data.layout (object) The jQuery object for the View layout wrapper
	*/
	
});

The custom search has been triggered

jQuery( document ).on( 'js_event_wpv_parametric_search_triggered', function( event, data ) {
	/**
	* data.view_unique_id (string) The View unique ID hash
	* data.form (object) The jQuery object for the View form
	* data.update_form (bool) Whether the custom search form will be updated
	* data.update_results (bool) Whether the custom search results will be updated
	*/
	
});

The custom search data has been collected

jQuery( document ).on( 'js_event_wpv_parametric_search_started', function( event, data ) {
	/**
	* data.view_unique_id (string) The View unique ID hash
	*/
	
});

The custom search form has been updated

jQuery( document ).on( 'js_event_wpv_parametric_search_form_updated', function( event, data ) {
	/**
	* data.view_unique_id (string) The View unique ID hash
	* data.view_changed_form (object) The jQuery object for the View form after being updated
	* data.view_changed_form_additional_forms_only (object) The jQuery object containing additional forms from other instances of the same View inserted using the [wpv-form-view] shortcode
	* data.view_changed_form_additional_forms_full (object) The jQuery object containing additional forms from other instances of the same View inserted using the [wpv-view] shortcode
	*/
	
});

The custom search results have been updated

jQuery( document ).on( 'js_event_wpv_parametric_search_results_updated', function( event, data ) {
	/**
	* data.view_unique_id (string) The View unique ID hash
	* data.layout (object) The jQuery object for the View layout wrapper
	*/
	
});

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

More from category
Aleš Sýkora wrote
Fluent Forms maps input (usable with Toolset Maps too)
If you want to add map field with click to put marker function and save the GPS data, you can use the Google Maps API with Fluent Forms. You will need Google Maps API Key and plugin for custom code snippets (you can also build your own plugin from the code by saving as PHP […]
Read More
Aleš Sýkora wrote
Change GDPR field response data in Fluent Forms
15. 4. 2021 in
If you want to change the “Accepted” to something else, use the first snippet and change the $response variable. If you want to change the Terms and Condition and GDPR field response, use this code:
Read More
Aleš Sýkora wrote
Flickity carousell same height slides fix
24. 3. 2021 in
If you need all your slides to have same height, add the CSS selector to your slider cells and use this code in your CSS: Do not forget to add the cellSelector attribute to your flickity slider setup:
Read More
magnifiercross linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram