Getrandomitem

Ask the community
,
1

Hi everyone, I’m not having much with the Getrandomitem function so hopefully someone can help me out.

I’m trying to create a random button which randomly selects an item from a database and inserts it an input text field. I’m trying to use the getrandomitem following the exact steps found in the velo package readme but with no succes. My code looks as follows and comes directly from the velo package readme:

import { getRandomItem } from ‘@velo/wix-data-helpers’;

//…

$w(‘#button18’).onClick((event) => {
getRandomItem(‘Visitors’)
.then((randomVisitor) => {
$w(‘#winnerText’).text = randomVisitor.name;
})
.catch((error) => {
console.error(error);
});
});

The database where the item should come from contains several columns.

Any help would be greatly appreciated
Many thanks

2

Are you getting any errors on your browser’s console? This code looks like it should work. Perhaps a permissions issue?

3

Hi Anthony, thanks for your quick response.

I´m not receiving any errors from my console log. One small change I had to make was change $w(‘#winnerText’).text to $w(‘#winnerText’).value as the .text property does not exist for type ´textinput´. I also changed the randomVisitor.name; to randomVisitor.title; to match the field key of the field name of the database collection where the random value must be retrieved from. My code looks as follows:

$w ( ‘#button34’ ). onClick (( event ) => {

getRandomItem ( ‘RandomNL’ )
. then (( randomVisitor ) => {
$w ( ‘#input1’ ). value = randomVisitor . title ;
})
. catch (( error ) => {
console . error ( error );
});
});

I ´m trying to understand why the code does not work. It may be because the field collection is in .text whereas the inputtext is .value. It may help to visit the cart page of my website to visualize what I´m trying to achieve. My website is www.wegoodly.com. please ignore any design errors as its still a work in progress😅. I can also share more code if necessary.

Many thanks in advance!

4

What page is the problem code on?

5

The cart page

6

The collection you are accessing doesn’t have a column with the fieldKey “title”. Since Field Key is what is used to refer to columns you’ll need to adjust “randomVisitor.title” to “randomVisitor.theActualFieldKey”. This can be a bit confusing as there is also a “Field Name” which isn’t used to access columns in code.

You can find the Field Key by going to the collection, selecting the three dots here and choosing “Edit”. Do note that once fieldKeys are set on a column you cannot change them (but could make a new column with the fieldKey and data you want).

7

Hi Anthony,

Thanks for noticing that I used the wrong FieldKey. I changed the FieldKey to the correct one. The code now sort of works.

Clicking on the random button does not display a random item. However, when clicking on the random button multiple times in quick succession, I can briefly see a random item appear and disappear in the input text field.

Don’t really know what to make of that.

8

Hi Anthony,

Thanks for noticing that I used the wrong FieldKey. I changed the FieldKey to the correct one. The code now sort of works.

Clicking on the random button does not display a random item. However, when clicking on the random button multiple times in quick succession, I can briefly see a random item appear and disappear in the input text field.

Don’t really know what to make of that.

9

Can you clarify what type of element you’re setting this text field on? Is it a Text element or something else?

Also do note that this function call is asynchronous so clicking the button won’t immediately provide a result it needs to wait for the server to respond which can take a few seconds.

10

HI Anthony,

I am trying to get the random item to be displayed in the #input1 which is an input text and has as type ´Text´. According to the data collection the the field where I am trying to get a random item from is also a ´Text´ type.

As for the asynchronous loading, ideally the results would be displayed immediately but a small delay is fine. However, no matter how long I wait the input text field does not display the random item after clicking the button.

Many thanks,

11

Hi Anthony,

I placed the function in an onReady call. The code looks as follows:

$w . onReady ( function (){
$w ( ‘#button34’ ). onClick (( event ) => {

getRandomItem ( ‘RandomNL’ )
. then (( randomVisitor ) => {
$w ( ‘#input1’ ). value = randomVisitor . vrijeBaptistenGemeentePhiladelphia ;
})
. catch (( error ) => {
console . error ( error );
});
});
});

The code now consistently displays a random text item in the input field but only does this once. Only on refreshing the page does the code work, but again, only once.