Unable to remove filters without overriding existing filters

Question:
Hi - I have been trying for a couple days and gone over a lot of content and documentation but can’t work this out.

Would anyone know how I can remove all filters without overriding existing filters?

Passing an empty filter through:

$w(‘#dataset1’).setFilter(wixData.filter());

seems to override and disable filters that I have created using inputs and linking to dataset.

Product:
Wix Editor

What are you trying to achieve:
I have a repeater with a large number of filters that I have created by creating checkbox and dropdown inputs then linking to database.

When I select and unselect manually, everything works.

However I need a “Remove Filter” button that will remove all filters and display full results. Then we need to be able to then filter data based off the checkboxes/dropdowns again.

What have you already tried:

This is my code to remove the filter currently. The idea is that it unchecks the checkboxes and removes filters, allowing users to then make another filtering selection:

//Remove Filter Button
export function removefilterButton_click(event) {
$w('#dataset1').setFilter(wixData.filter());
$w('#biomaterialsCheckbox').checked = false;
$w('#zerowasteCheckbox').checked = false;
$w('#filterlocationDropDown').selectedIndex = 0;

}

Any help or suggestions would be great. Is this happening because I have used the drag and drop repeater filter instead of writing filtering logic myself?

This is all you need to RESET a filter…

—> $w('#dataset1 ').setFilter();

Hi @CODE-NINJA really appreciate the quick reply!

I have tried that but I am getting the following error showing that it is expecting an argument:

“Expected 1 arguments, but got 0.”

image

What about defining new empty filter?

let resetFilter = wixData.filter();
$w('#dataset1').setFilter(resetFilter);

Your setup should look something like this…

$w.onReady(()=>{
	$w('#dataset1').onReady(()=>{
		$w('#startfilterButton').onClick((e)=>{console.log(e.target.id+'-clicked');
			start_filter();
		});

		$w('#removefilterButton').onClick((e)=>{console.log(e.target.id+'-clicked');
			reset_filter();
		});
	});
});

function start_filter() {console.log('filter running...');
	let filter = wixData.filter()
	if ($w('#aaaaa').value) {filter = filter.eq('dbField', $w('#aaaaa').value}
	if ($w('#bbbbb').value) {filter = filter.contains('dbField' $w('#bbbbb').value);}
}

function reset_filter(event) {console.log('reset running...');
	let resetFilter = wixData.filter();
	$w('#dataset1').setFilter(resetFilter);
	//------------------------------------
	$w('#biomaterialsCheckbox').checked = false;
	$w('#zerowasteCheckbox').checked = false;
	$w('#filterlocationDropDown').selectedIndex = 0;
}

Better don’t use EXPORT-FUNCTIONS from the property-panel!
—> export function removefilterButton_click(event) { <-----

Just to close this off -

Thanks for your help russian-dima

I solved this by writing my own filtering logic and running this using onChange event.

I haven’t been able to work out how to reset filters applied by the GUI so had to roll up my sleeves and code everything

1 Like