Collecting Data Search/ Randomly changing data on a repeater

Ask the community
, ,
1

I would like to have a data search that would include 2 fields that is name and area.
Also I would like all of the data to randomly change order on a repeater that is connected to one of my collection in content manager.
Please advise if this possible - thank you!

2

Hello Shelly Bennett,

if you want to realize something which shall work randomly, so at first i would look for posts here at forum, with the question…

How does it work.

Here you have several posts to this topic.

  1. https://www.wix.com/corvid/forum/community-discussion/random-number-generator
  2. https://www.wix.com/corvid/forum/community-discussion/random-pic-homepage
  3. https://www.wix.com/corvid/forum/community-discussion/random-text-display-code-help

I am sure there are a lot more examples which you can find here in this forum, just take a look.

3

Hi :raised_hand_with_fingers_splayed:

You can do so by setting a dynamic filter and bond it with an event handler, and make the event handler trigger the function that will filter your dataset , and then refresh the data.

Creating the dynamic filter:

async function setFilter() {
    let name = $w('#name').value;
    let area = $w('#area').value;
    let filter;
    
    if (name === undefined && area !== undefined) {
        filter = wixData.filter().eq('area', area)
    } else if (name !== undefined && area === undefined) {
        filter = wixData.filter().eq('name', name)
    } else if (name !== undefined && area !== undefined) {
        filter = wixData.filter()
            .eq('area', area)
            .eq('name', name)
    }
    
    await $w('#dataset1').setFilter(filter)
}

Triggering the function (call it), we’ll use a button’s onClick() event handler to set the filters

$w('#search').onClick(async(event) => {
    await setFilter().then(() = {
        // Refresh the dataset
        $w('#dataset1').refresh();
    }).then(() = {
        // Repopulate the repeater's data
    })
})

Now we need to repopulate the data in the repeater, for this goal, we need to use the forEachItem() function, this will update each and every item.

$w('#repeater1').forEachItem( ($item, data) => {
    $item('#nameElement').text = data.name;
    $item('#areaElement').text = data.area;    
})

Hope that helped~!
Ahmad

4

thank you Ahmad - I am not a coder so I don’t understand the code above.

5

You’re basically check the values (name and area) and filter only the ones that have values, that’s what the first block of code does.

The second block will filter the dataset when you click on the button to get the results by calling the function from the first block of code, then refreshing the dataset and getting the newest items that matches the filter.

And the third block of code will populate the repeater’s new and old items to display the name and area.

NOTE : The third block of code must be placed inside the labeled place in the second block.

6

A simple search here would have given you an easy example for randomising/shuffling the repeater results shown below.
https://www.wix.com/corvid/forum/community-discussion/display-12-content-on-repeater-shuffle-code
https://www.wix.com/corvid/forum/community-discussion/repeater-filter-randomize-and-search
https://www.wix.com/corvid/forum/community-discussion/randomizing-my-repeater
https://www.grampsworkbench.com/Examples/Shuffle-Repeater