Hi, I've a View with 2 filters and "Show only filter options that would produce results" selected.
I've noticed that on Blocks I cannot change the "Choose if you want to hide or disable irrelevant options for inputs:" option, I can only hide the irrelevant options. I can do it with Views, but I miss this option on Blocks.
This is what I'm trying to do:
1. I'd like to always display all the options on the first filter and they should be active. Can I do it with some custom code?
2. I'd like to reset the second filter every time I chage the first filter value (so the second should display the default placeholder). Is it possible?
cheers
Hi,
Thank you for contacting us and I'd be happy to assist.
Your observation is correct and in Blocks based views, it is not possible to disable irrelevant search filter options and they can only be hidden. I'm going to share this feedback internally to the concerned team.
1. I'd like to always display all the options on the first filter and they should be active. Can I do it with some custom code?
- The "Show only filter options that would produce results" in Blocks view works for all the search filters and I'm afraid, it can't be made to restrict to particular fields.
2. I'd like to reset the second filter every time I chage the first filter value (so the second should display the default placeholder). Is it possible?
- This is possible using Javascript/jQuery and you can structure your custom function for this in a way that it ininitialize it with "js_event_wpv_pagination_completed", "js_event_wpv_parametric_search_results_updated" and "ready" events.
( this is needed if the view is set to update results using AJAX, so that our custom script can initialize on the completion of pagination, search and page load operations )
Example:
jQuery( document ).on( 'js_event_wpv_pagination_completed js_event_wpv_parametric_search_results_updated ready', function( event, data ) {
// actual script to change the value of one input field based on the change in another
});
-I hope this helps and please let me know if you need any further assistance around this.
regards,
Waqar
Hi Waqar, thanks for your answer. Can you give me an example of Javascript/jQuery to reset the second filter every time I chage the first filter value? I tried this:
var dockOld = '';
var dockNew = '';
var dockChange = 'False';
jQuery(document).ready(function($) {
jQuery('[name=wpv-wpcf-stand]').attr('disabled', 'disabled');
jQuery('[name=wpv-wpcf-dock] option').removeAttr('disabled');
});
function dockSelectChange() {
jQuery('[name=wpv-wpcf-dock]').on('focus', function () {
dockOld = this.value;
}).change(function() {
dockNew = jQuery('[name=wpv-wpcf-dock]').val();
dockChange = 'True';
console.log('dockOld: '+dockOld);
console.log('dockNew: '+dockNew);
console.log('dockChange: '+dockChange);
});
}
jQuery( document ).on( 'js_event_wpv_parametric_search_results_updated', function( event, data ) {
dockSelectChange();
jQuery('[name=wpv-wpcf-dock] option').removeAttr('disabled');
console.log('--if--');
if (dockChange == 'True') {
if (dockOld != dockNew) {
if (dockNew == 0) {
console.log('dockNew == 0');
jQuery('[name=wpv-wpcf-stand] option').removeAttr('selected');
jQuery('[name=wpv-wpcf-stand]').attr('disabled', 'disabled').val('');
} else {
console.log('dockOld != dockNew');
jQuery('[name=wpv-wpcf-stand] option').removeAttr('selected');
jQuery('[name=wpv-wpcf-stand]').removeAttr('disabled').val('');
}
}
dockChange = 'False';
}
});
It works fine on the select, but it doesn't reset the search and it doesn't remove the current 2nd filter option if the result is empty (depending on the new 1st filter option).
can you help me?
Thanks for writing back.
I'll be happy to take a look and share an example if you could send the link to a page with this view.
Hi Waqar, this is the example:
hidden link
cheers
Hi,
Thank you for sharing the link.
I've tested the search form on this page and noticed that the second filter ( wpv-wpcf-stand ), gets reset every time the first filter ( wpv-wpcf-dock ) is changed.
Looks like you've managed to make this work after writing to us, but in case it still doesn't work for any particular case, please do let me know about the exact steps.
regards,
Waqar
Hi Waqar, it works fine but it doesn't reset the search and it doesn't remove the current 2nd filter option if the result is empty.
For example, if I select:
1st select location - the first option "Agua Amarga"
2nd select type - the first option "Casa completa"
then I change to:
1st select location - the second option "Boca de los Frailes"
my JS reset the second filter, but I get no result because it is still filering by "Casa completa". I also still find "Casa completa" on the 2nd filter even if there aren't any result in "Agua Amarga" (I attach a screenshot).
Hi,
Thank you for the screenshot and I understand what you're referring to.
Can you please also share temporary admin login details, so that I can troubleshoot this after looking into the data and view's filter in the backend?
Note: Your next reply will be private and please make a complete backup copy, before sharing the access details.
regards,
Waqar
Hi,
Thank you for sharing the admin access.
Can you please replace your custom script with:
jQuery( document ).on( 'js_event_wpv_pagination_completed js_event_wpv_parametric_search_results_updated ready', function( event, data ) {
jQuery('select[name=wpv-wpcf-dock] option').removeAttr('disabled');
var wpcfDock = jQuery('select[name="wpv-wpcf-dock"]').val();
if (wpcfDock == '0') {
jQuery('[name=wpv-wpcf-stand]').attr('disabled', 'disabled');
}
jQuery('select[name="wpv-wpcf-dock"]').on('change', function() {
jQuery('select[name="wpv-wpcf-stand"]').val(0);
});
});
This should do the trick.
regards,
Waqar
Hi, it works fine, I've just added this to disable the 2nd filter on first page load:
jQuery(document).ready(function($) {
jQuery('[name=wpv-wpcf-stand]').attr('disabled', 'disabled');
});
My issue is resolved now. Thank you!
