Entering a code for a fictional "lottery"

Ask the community
, ,
1

Hello!

I have a school assignment in which I have to create a website for a fictional shoe store for one of my teachers. It isn’t an e-store on it’s own, mostly informative, but there is one page where costumers can enter a code that they got at the store and maybe win a prize.

1161×652 17.8 KB

As you can see above I have a field where the code can be entered and below that a button to confirm that the user wants to enter that code. Under that is a text that says (in Dutch) “You have won:”. Under that text there’s another piece of text that says “Your content has been submitted” (This is of course the submit succes message from the button). Now what I want to do is this: When a visitor of the site enters the code they got from the store and click on the button, I want the succes message to say the prize accompanied by that particular number. I have made a dataset below:

1887×788 41.2 KB

I have numbers from 1 - 1000 in the first column and the prizes in the right column. I’m trying to get the button to check which number is accompanied by which prize and then show the prize in the succes message field.

How do I do this?

Also, I need an option that when the submit button is pressed another button will show up when if costumers click on that one, they can enter their contact details and get a confirmation e-mail of what and when they can pick it up.

Thanks in advance everyone!

2

Hello Cedric,

The first step would be to query your database and find the number inputted.

It would look something like this:


$w('#exampleInput').onClick(() => {
    const value = $w('#exampleInput').value;
    wixData.query('YourCollectionName')
    .eq('numberLot', value)
    .find()
    .then((foundItem) => {
        let prize = foundItem.items[0].prize;
        $w('#exampleText').text = prize;
        $w('#exampleContactButton').show();
    })
});

$w('#exampleContactButton').onClick(() => {
    $w('#exampleContactForm').show();
});

A couple things to look out for:

  1. Replace the Id’s I put here for example purposes with the Id’s you have on your site (You may have to add more elements such as the contact form, contact button, as well as the example text where you will show the prize won.

2.Make sure your input and field match in regards to type, in the query we are seeing if the input value matches a value we have in the database from the numberLot field. IF one is string and another is a number then it will not match.

Goodluck!
Majd

3

Thanks for the reply! This is my first time using Wix in such a manner. I’m not getting any results though, whenever I enter my code, click the button and am anticipating the accompanying prize to show up, nothing happens. Here’s my code:

import wixData from ‘wix-data’;
$w.onReady( function () {
//
$w(‘#button5’).onClick(() => {
const value = $w(‘#input1’).value;
wixData.query(‘dbsLoterij’)
.eq(‘Prijs’, value)
.find()
.then((foundItem) => {
let prize = foundItem.items[0].prize;
$w(‘#text11’).text = prize;
})
});

“button5” represents the button I click to check the lottery number.
“input1” represents the input box I use to enter the lottery code.
“text11” represents the textbox where the prize that is in the same row as the lottery code/number I entered is supposed to show up.

Also, should I put this code on the “Page” tab of Wix Code or “Site” tab of Wix Code?

What have I done wrong?

4

I think the part that is messed up looking at the solution and your code posted is this part here
wixData.query(‘dbsLoterij’)
.eq(‘Prijs’, value) <---------

Your asking the query to check the wrong column, i think you need to change that to the ‘number lot’ column, as the results of the query would post the prize data information.

I am newbie to code so i could be wrong.

Also you want the code on the Page tab

5

Good catch!