Thanks for writing back.
The script was showing an error because the taxonomy multi-select name used on your website is 'wpv-offering', but the code that I shared in my last message had the name 'wpv-location'.
( as this is what I was using on my test website )
Your observation is correct and the way the taxonomy query filter works, if it encounters an empty value or a value for which a term is not found, the query returns no result.
To overcome this, here is what I'll recommend:
1. You'll need a custom function attached to the 'wpv_filter_query' filter, that will unset the taxonomy query filter for the specific taxonomy if a non-existent term is encountered for it.
( ref: https://toolset.com/documentation/programmer-reference/views-filters/#wpv_filter_query )
For example:
add_filter( 'wpv_filter_query', 'filter_empty_tax_custom_fn', 1000 , 3 );
function filter_empty_tax_custom_fn( $query_args, $view_settings ) {
// check for a specific view
if ( ( !is_admin() && isset($view_settings['view_id'] ) ) && ( $view_settings['view_id'] == 12345 ) )
{
// check if any taxonomy query filter is set
if ( (!empty( $query_args['tax_query'])) ) {
// run code for each tax query available
for ($i=0; $i < (count($query_args['tax_query']) - 1) ; $i++) {
// case for the taxonomy 'location'
if ( $query_args['tax_query'][$i]['taxonomy'] == "offering") {
// if no term is set
if ( $query_args['tax_query'][$i]['terms'] == 0 ) {
// unset the query filter for this taxonomy
unset($query_args['tax_query'][$i]);
}
}
}
}
}
return $query_args;
}
Note: You'll replace '12345' and 'offering' with your actual view's ID and the target taxonomy's slug, respectively.
The above code snippet can be included through either Toolset's custom code feature ( ref: https://toolset.com/documentation/adding-custom-code/using-toolset-to-add-custom-code/ ) or through the active theme's "functions.php" file.
2. Here is the updated script that I'll recommend using. It is the same one as my last message, except for:
a). It uses the correct taxonomy field name 'wpv-offering', and
b). It will set the new default option as the selected option, but only if no other option is selected.
( because it doesn't makes sense to select the default 'Any' option when some other option or options are selected too )
document.addEventListener("DOMContentLoaded", function() {
// Get the select element
const selectElement = document.querySelector('select[name="wpv-offering[]"]');
// Get the selected options
var selectedOptions = document.querySelector('select[name="wpv-offering[]"]').selectedOptions;
// Get the selected options values
var selectedValues = Array.from(selectedOptions).map(({ value }) => value);
// Create a new option element
const defaultOption = document.createElement('option');
defaultOption.value = '';
defaultOption.text = 'Any';
// Set the new option as the default selected option, only if no other option is selected
if (selectedValues.length == 0) {
defaultOption.selected = true;
}
// Add the new option to the beginning of the select element
selectElement.insertBefore(defaultOption, selectElement.firstChild);
});
I hope this helps and for more personalized assistance around custom code, you can also consider hiring a professional from our list of recommended contractors:
https://toolset.com/contractors/
