Filtering with selection tags while maintaining dataset filter


I have a page on my website using Velo code to connect to a selection tag. When a tag is clicked, the data is filtered, only showing the people that work at the specific selection tag.

I also have a dataset filter to only show people who have a boolean “true” in one of the columns. However, when I click the selection tag, it no longer uses the dataset filter and displays people I don’t want it to.

Here’s the code I have so far for selection tags:

import wixData from ‘wix-data’ ;

const databaseName = ‘Team’ ;
const databaseField = ‘locations’ ;

$w . onReady ( function () {

$w ( '#selectionTags1' ). onChange (( event ) => { 
    **const**  selectedTag  =  $w ( '#selectionTags1' ). value ; 
    addItemstoRepeater ( selectedTag ); 


function addItemstoRepeater ( selectedOption = ) {

**let**  dataQuery  =  wixData . query ( databaseName ); 

**if**  ( selectedOption . length  >  0 ) { 
    dataQuery  =  dataQuery . hasSome ( databaseField ,  selectedOption ); 

    . find () 
    . then ( results  => { 
        **const**  filtereditemsReady  =  results . items ; 
        $w ( '#repeater1' ). data  =  filtereditemsReady ; 



I want to add a line in there somewhere to say “after filtering with the selection selection tag, apply column filter in dataset,” but I don’t know where to begin.

The column name is visibleOnProvidersPage. The value needs to be true for them to be displayed.

The content database name is Team.

Either work with a dataset or with direct queries, but don’t mix the together.
If you prefer working with datasets, use dataset,setFilter instead of your queries.

and always filter for all parameters (it doesn’t “remember” the previous filter)

Hi, I am having the same issue as you. Did you manage to find a solution?
I have set a dataset filter to the page so it only shows relevant items. Selection tabs narrow down the items as they should, but upon deselecting the tags, I see all the unfiltered items which weren’t originally on the page

Do you mind elaborating on this further please?
The selection tab works fine with my dataset filter, by as soon as I want to remove the selection tag field it reverts back to seeing all data rather than the filtered dataset. I have seen your link but am confused how to embed and ‘filter for all parameters’ like you mentioned

$w('#selectionTags').onChange(({target}) => {
let filter = wixData.filter().eq('isActive', true);//this is an example. If you don't have any initial filter, remove the .eq method.
const {value} = target;
filter = filter.hasSome('fieldKey', value);

Not really… hoping for some more assistance on this.

I tried this code out with my variables and it doesn’t appear to be working. I assume there’s something missing?

There was an extra parenthesis. Fixed. Check if it works for you.
If not - post your code.

Ah, yes, I already removed the extra parenthesis. This is my code that doesn’t do anything.

In your original code, selectedValues threw an error, so I made it the same variable as selectedTag.

I want the initial filter to show only providers that are marked active from the visibleOnProvidersPage column in the dataset.

Then, I want to filter the rest of the providers based on which selection tags are clicked. If none are clicked, then show all providers. When a selection tag is clicked, I want the initial filter of only showing active providers to still be applied first and always.

import wixData from ‘wix-data’ ;

const databaseField = ‘locations’ ;

$w . onReady ( function () {

$w ( '#selectionTags1' ). onChange (({ target }) => { 
**let**  filter  =  wixData . filter (). eq ( 'visibleOnProvidersPage' ,  **true** ); 
**const**  { selectedTag } =  target ; 
**if** ( selectedTag . length ){ 
filter  =  filter . hasSome ( databaseField ,  selectedTag ); 

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


I changed the code a little bit (I wrote it too quickly without a second read, sorry for that).
Please stick to the variable name as it is a destructuring assignment of a given object.
const {value} = target;
is equivalent to const value = target.value;

Yes, success, thank you!

Do you know if this code preserves sorting too? Like, will it apply my A-Z sort after the filter too, or is another line required?

Edit: Added the filter line, nevermind!

I believe it preserves the previous sorting, but you should test and see.


I am not very good as using Velo, although I am using some codes from time to time. I am trying to use your code for my page, without success.
I don’t understand the code, hence I dont understand how to adapt it to my page.
I want that, when no tags are selected, the filters in my dataset are active again.

The code on my page is the following. How should I add your code to that ?

import wixData from 'wix-data';

$w.onReady(function () {


$w('#selectionTags1').onChange(() => {
const selectedTag = $w('#selectionTags1').value;
let filter = wixData.filter();
if (selectedTag.length > 0) {
filter = filter.hasSome("artworkTag", selectedTag);

Thank you