[Resolved] Conditional filters on search view

[Author]

Posts

[avansisI-2]

Hello,

I need to create a conditional view between two filters on a view but i dont know how it works.

i tried adding [wp-conditional] but it didnt work

i want to show a taxonomy filter when users select one category from category selector.

Category shortcode: [wpv-control-post-taxonomy taxonomy="category" type="checkboxes" format="%%NAME%%" style="border-radius:40px;" url_param="wpv-category"]

taxonomy which i want to show: [wpv-control-post-taxonomy taxonomy="licitador" type="radios" url_param="wpv-licitador"]

i tried with this but didnt work also: [wpv-conditional if="( CONTAINS(#(category),'') )"]

i tried adding javascript code after give a class to shortcode:

(function($) {
$(document).ready(function() {

$('.licitador').hide();

$('.wpv-category').change(function() {
var current = $(this).val();
if (current == 2) {
$('.licitador').show();
}
});
});
})(jQuery);

it didnt work also.

Can u help me?

Thank u!

[Christian Cox]

I need to create a conditional view between two filters on a view but i dont know how it works...i tried adding [wp-conditional] but it didnt work
Hello, there a few things I would like to explain here.

First, conditionals with wpv-conditional are designed to work by testing content, not filters. So you won't be able to use wpv-conditional shortcodes to determine which filters are selected in a custom search View, they aren't designed for this purpose.

Second, there is no public JavaScript API for custom search filters, so support for customizing filters with JavaScript is very limited here in the forums. I can help you implement our front-end event hooks if you'd like to trigger your own custom code at specific events in the search and pagination process. When using the legacy Views editor, you can open the JS editor in the Search and Pagination panel to insert one or more of these event hooks. If you cannot see the Search and Pagination panel, scroll to the top right corner of the screen and open the Screen Options tab. You can turn on the Search and Pagination panel there. I'm attaching a screenshot here showing you where to find the JS front-end events button. You can create different event hooks here for pagination or filter events, and trigger your own custom JavaScript code.

Third, the contents of a custom search form are frequently replaced in the DOM if your View has any of these configurations:
- Only show the available options for each input
- Inputs update automatically whenever another input is changed
- Custom search or pagination uses AJAX
So if you hide a specific filter with JavaScript, then change another input, the original hidden input may reappear when the filters are replaced in the DOM automatically. You may need to use the front-end event hooks I mentioned earlier to reapply custom JavaScript after the fields are replaced in the DOM.

[avansisI-2]

Thank you Christian,

i added a custom javascript on that field:

(function($) {
$(document).ready(function() {

$('.envase').hide();

$('.wpv-category').change(function() {
var current = $(this).val();
if (current == 'aceite') {
$('.envase').show();
}10
});
});
})(jQuery);jQuery( document ).on( 'js_event_wpv_pagination_completed', function( event, data ) {

});

I think it has not worked properly. I have two issues:

1. When I click on the conditional it does apply it, but when I select another element, it doesnt disappear again
2. Labels of each element dont disappear, only the checkboxes

can u help me with that?

Thank u!

[Christian Cox]

It looks like you didn't put any code in the event handler. If you want to trigger some code when the View's AJAX pagination has completed, you would use this format:

jQuery( document ).on( 'js_event_wpv_pagination_completed', function( event, data ) {
  // add your own code here. this code will be triggered when pagination is completed
});

However, your problem description does not seem to be related to pagination, so I do not think the pagination event will be helpful here. Your description seems to be related to search events, like when the filters are updated. To trigger code when filters have been updated, you should use this format:

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
	*/
	// add your own code here. this code will be triggered when the filters have been updated. you have access to the data described above in the data variable
});

[avansisI-2]

My issue is resolved now. Thank you!