Filtering with random function

Ask the community
,
1

Here is the live page in question: https://www.crosslakecree.com/flashcardslanding

I am using a random function to ‘shuffle’ my deck of flash cards.
Can I filter the results? I have some entries that I have not yet translated (it’s a language learning app). I have the placeholder “Need Translation” in the ‘English’ field. I want to omit those from appearing in the flash cards deck for now.

Of course using the built-in dataset filtering tool is useless because the index numbers I am generating go from 1 to ‘total count’.

Suggestions for a work around?

My code:

import wixData from ‘wix-data’ ;

export function image2_click ( event ) {
// Add your code for this event here:

// clear any filters in the dataset
$w ( “#dataset1” ). setFilter ( wixData . filter () );

// get size of collection that is connected to the dataset
let count = $w ( “#dataset1” ). getTotalCount ();

// get random number using the size as the maximum
let idx = Math . floor ( Math . random () * count - 1 );

// set the current item index of the dataset
$w ( “#dataset1” ). setCurrentItemIndex ( idx );

}

2

Oh also I want to index a random card on page load. Right now it’s only on click.
Thanks.

3

Are you showing the dataset in a repeater or something? Or just a single item from it?

If you are only showing a single card at a time I probably wouldn’t put this into a dataset and instead just do a query. You would get a list of items that match your query. You could then get a random number between 0 and the length of that -1 to get your random card. Then just use the data from that item to update whatever elements are on the screen.

I guess I am not sure I understand why filtering doesn’t work based on totalcount. You can get the total amount in the filtered set of data, not the total amount before the filter

4

@archaeous ok do you know what code I could use to
accomplish this? I am wasting hours trying to play around with it to make it do that. I need help because I am such a beginner.

5

@archaeous I already tried removing the line of code that resets the filter I have on the dataset. But it didn’t work.

6

you can set a filter via code like this
usually what I do is set the default filter to something that can never happen so it starts out empty

Then if you want it to happen on page load
export async function dataset1_ready () { //create this method by clicking the dataset and creating an on_ready event
await $w ( ‘#dataset1’ ). setFilter ( wixData . filter ()
. eq ( “English” , “Need Translation” )
//you can add as many conditions as you want
)
$w ( ‘#yourRepeater’ ). refresh ()
})

I prefer using async / await rather than .then() but both yield similar results

now your dataset has only good values in it. This works if you have a repeater.

If you aren’t using a repeater and just using a single element on the page it is even easier

in your pages onready function

$w . onReady ( async function () {
let myData = await wixData . query ( “whateveryourcollectionnameis” )
. eq ( “English” , “Need Translation” )
. find ()

after this you would be able to get the total number of items on either the collection or the query, and then pick a random number and get the data from that element

like myData.items[5] would give everything about the 6th item in the query. You could then assign that data to the cards elemets.

Like $w(‘#englishTranslation’).text = myData.items.English
would assign the textbox with the data from the collection. You can assign images this way too.

7

@archaeous thanks a lot. Not having success follow up questions in video attached.

Edit**at the very end of the video I said I wrote the name of the database in purple but i meant to say I put the name of the repeater in purple.

Here is the ugly mishmash of code so far :

import wixData from ‘wix-data’ ;

$w . onReady ( function () {

 $w ( "#switch1" ). onClick (() => {

if ( $w ( “#switch1” ). checked ) {
$w ( “#englishFlash” ). hide ()
$w ( “#creeFlash” ). show ()
} else {
$w ( “#englishFlash” ). show ()
$w ( “#creeFlash” ). hide ()
}
})

});

//first set the default dataset filter to something that can never happen like ‘cree is impossible’.
//so it starts out empty

//shuffle on page load
export async function dataset1_ready () { //create this method by clicking the dataset and creating an on_ready event

await $w ( ‘#dataset1’ ). setFilter ( wixData . filter ()
. eq ( “English” , “Need Translation” )
. eq ( “Cree” , “Need Translation” )
//you can add as many conditions as you want
)

$w ( ‘#Repeater1’ ). refresh ()

})

//now the dataset has only good values in it.

export function image2_click ( event ) {

// get size of collection that is connected to the dataset
let count = $w ( “#dataset1” ). getTotalCount ();

// get random number using the size as the maximum
let idx = Math . floor ( Math . random () * count - 1 );

// set the current item index of the dataset
$w ( “#dataset1” ). setCurrentItemIndex ( idx );

}
//get the total number of items on either the collection or the query, and then pick a random number and get the data from that element

like myData . items [ 5 ] would give everything about the 6 th item in the query . You could then assign that data to the cards elemets .

$w ( ‘#Repeater1’ ). text = myData . items . English
$w ( ‘#Repeater1’ ). text = myData . items . Cree
$w ( ‘#Repeater1’ ). text = myData . items . Category
$w ( ‘#Repeater1’ ). text = myData . items . Subcategory
$w ( ‘#Repeater1’ ). text = myData . items . Image
$w ( ‘#Repeater1’ ). text = myData . items . ID

8

It would be useful to show your DATABASE.
How is structured your DB?
Show all needed ELEMENTs & ELEMENT-IDs, pls.

9

@russian-dima Here are the linked elements used in the repeater (#repeater1):
#image3 links to → “Image” (image)
#creeFlash links to → “Cree” (text)
#englishFlash links to → “English” (text)
#text13 links to → “Category” (text)
#text16 links to → “Subcategory” (text)
#text11 links to → “ID” (text)

10

@jasminenicolespence
What i wanted to see i a screenshot of your DB. So i would be able to reconstruct it and show you an working example. :wink: (till tomorrow-evening).