I'm trying to display a list of filtered elements.
I'm using the Divi Builder and some CSS to add a style to my list.
When the page load the first time, everything's fine, but when I select some options in the filters, the style break.
It seems to be linked to the custom search settings. On "AJAX results update" the style break, on "Full page refresh" it's fine.
I'd like to use AJAX without the style failing.
Thanks.
Hello. Thank you for contacting the Toolset support.
Well - view's offers the ajax filter hooks that you may try to use and check if that helps.
When you visit view's Filter section's JS box - you will see a button "Frontend Events". When you click it it will allow you to choose ajax callback events for parametric search.
Refer this image:
=> hidden link
For example:
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
*/
});
you should try to use above JS event hook and try to update custom styling from there. Please try to play with that and let me know if that works 🙂
It doesn't work... Instead of using AJAX to show result, I use the full page refresh on search click.
It fixed the style that was not displayed right, but now, all elements at the bottom of the page are broken.
Again, I use the divi builder to put element on my page.
Here some screenshots of what it should always be displayed and what happened when I click on the search button.
If above does not hep, I need problem URL and access details so I can check whats going wrong there.
*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin and FTP) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.
I would additionally need your permission to de- and re-activate Plugins and the Theme, and to change configurations on the site. This is also a reason the backup is really important. If you agree to this, please use the form fields I have enabled below to provide temporary access details (wp-admin and FTP).
I have set the next reply to private which means only you and I have access to it.
Also - could you please check with Divi support that how to load the required assets (CCS + JS) with AJAX call. Please check with them if they have any hooks or filters that we can use. Pass on the same problem URL with them so they will see the issue and guide us.
Well - there is no easy or proper way to get the suffix number we are using when entering a View. The number highly depends on the calback function to use for rendering the section, and we can not get such a big amount of data, and the fill our code of checks against the existence of Divi methods.
In addition, Divi can produce those class names cleanly because they follow the page render flow, but on AJAX we have no easy way to do that .
Such class names should not be used for styling purposes because their existence and matching order can not be ensured, and specific, dedicated ones should be used.