Display a category from Wix Stores/Collections?

Ask the community
, ,
1

Hello :slight_smile: How to display a category from Wix Stores/Collections to a custom repeater on a page visit ? thanks.

2

Hi Emma,

  • First add a dataset and connect it to the database category collection.
  • Second , add a repeater and connect it to your dataset.

In order to present a specific category items in the repeater filter you dataset:

  1. You can set a filter at your dataset’s settings. Here you can get an information about filtering.

  2. You can also write it in code.

    • Add an event handler that run when the dataset’s ready.
      (Go to the dataset’s properties and add an onReady() event)

    -At the handler write the setFilter() function.
    Here you can read more about this function.

Best of luck!
Sapir,

3

Hello #Sapir :slight_smile: to be honest my coding skills are pretty limited. Can’t you just write an example code here so me and others would benefit from it ? Thanks.

4

Hi Emma,

First, as I said you don’t necessarily need a code to filter your dataset.
If you still want to do it on code, see the code below:

  
export function dataset_ready() {
    $w("#dataset").setFilter(wixData.filter()
            .eq('category', "myCategory")
        }) 
}

At the eq() function, write the field key of the category field from the collection, and the desirable category.

Best,
Sapir

5

Thank you so much #Sapir :slight_smile: oh btw, do i have to put all the code on pages onReady ? Like the whole code would be like…

$w.onReady( function () {
export function dataset1_ready() {
$w(“#dataset1”).setFilter(wixData.filter()
.eq(‘category’, “myCategory”)
})
}
});

please correct me if i am wrong ? :smiley:

6

HI Emma,

export function dataset1_ready() , means that I added to my code an event handler that runs when the dataset is ready. In order to import this function, go to the dataset’s properties and press on the + button at the onReady() event (view the picture below).
At this way, you can add several functions that run after a specific event occurs to an element.
I suggest you to read this article about Event and Event Handler, it can help you understand better.

812×784 56.9 KB

The function below is used for code you want to run before the user starts interacting with your page.
It’s important to be familiar with this function, here you can read more about the code that should be placed inside.

 $w.onReady(function () {
 //TODO: write your page related code here...

});

Best of luck!
Sapir