Show all items in a repeater that is linked to dropdown

Ask the community
,
1

Hello everyone,
I have looked through youtube and the forum to find an answer, but have not found one yet.

On this page I want to show all partner companies I work with. So when the user enters the page, I want all partners to be shown in the repeater, rather than just the ones from the first dropdown menu category. I then want to allow the user to select a category from the dropdown to see the partners from that category. The choices from the dropdown are based on a dataset and so not linked to the same dataset as the repeater. In the company dataset, the category is referenced through a reference field to the category dataset.

Maybe someone can help me out with the code I need to make this work.

Would really appreciate any help!

1505×650 96 KB

2

Ok, my idea would be …

to create 2 different functions which would be quering your 2 different databases.

  1. Query-1 (unfiltered)
  2. Query-2 (filtered)

and push the results into repeater, something like this. Just a quick theoretical thought.

3

Hey russian-dima,

thanks for the replay. Unfortunately, I am a code beginner, so I do not know how to do this in code.

4

@digital99103
Ok, this could be a little problem :grin:
Code-beginner and REPEATER ist not a good combination.

But i will take a look later.

5

@russian-dima I currently have the following code, which I copied and tried to adjust:

import wixData from ‘wix-data’ ;

const collectionName = ‘Partnerprofile’ ;
const fieldToFilterByInCollection = ‘category’ ;

$w.onReady( function () {

loadDataToRepeater();

});

function loadDataToRepeater(selectedCategories = []) {

let dataQuery = wixData.query( ‘Partnerprofile’ );

if (selectedCategories.length > 0 ) {
dataQuery = dataQuery.hasAll(fieldToFilterByInCollection, selectedCategories);
}

dataQuery 
    .find() 
    .then(results => {

const itemsReadyForRepeater = results.items;
$w( ‘#repeaterPartner’ ).data = itemsReadyForRepeater;
const isRepeaterEmpty = itemsReadyForRepeater.length === 0

if (isRepeaterEmpty) {
$w( ‘#repeaterPartner’ ).show();
} else {
$w( ‘#repeaterPartner’ ).hide();
}
})
}

6

@digital99103
Dir ist schon klar, dass einfach nur etwas zu kopieren, nicht wirklich funktionieren kann , oder?:wink:

Ok, i will try to make a little example of it.
Meanwhile you could take a look at my examples, perhaps you will see a similar project which will give you some new insights, who knows :wink:.

7

Hello again,

is this what you wanted to have?

https://russian-dima.wixsite.com/meinewebsite/repeater-dropdown

8

@russian-dima that looks great.
I hope the dropdown categories are based on a dataset and maybe you can add an “all” option or a show all button.

9

@digital99103

I hope the dropdown categories are based on a dataset

This does not matter for the code. You can set up the dropdown like you want.

  1. manually
  2. by dataset

Everything is possible.