Verification Abilities

Ask the community
,
1

Hello Wix,

Is it at all possible using Wix Code to set that (with being connected to a button) that when a user enters a specific text in a text box that when they push for example a “Next” button that it will only let them proceed if the text they entered is exactly the same as something already in a database?

I’m afraid I don’t know how to code, but this could be very useful in multiple applications of use.

Thanks,
Jason

2

Hi Jason,

It is possible, but you need to code for it.
I’ll share a small example.
Let’s say I have a database named ‘myPets’ of pet type and their names:
petType petName
Dog Bob
Cat Mitzi

And I have a textbox (‘#textInput1’) and a button (‘button1’) that tries to verify the name of the dog. The button should have an onClick() function that uses wixData.query() to check the database:

export function button1_click(event) {
	const userInputText = $w('#textInput1').value;
	wixData.query('myPets').eq('petType', 'Dog').find().then(result => {
		const dogItem = result.items[0];
		if (dogItem.petName === userInputText) {
			//Validation success - do something
		} else {
			//Validation failure - do something else
		}
	})
}

Hope this helps,

Liran.

3

Thank you Liran!

So I could use the code above and somehow apply it to verify with any entry in a row in a database?

Also, within this part:

 //Validation success - do something 
 } else { 
 //Validation failure - do something else

Do I need to replace that part with a specific set of instruction or is that already included within:

export function button1_click(event) {
	const userInputText = $w('#textInput1').value;
	wixData.query('myPets').eq('petType', 'Dog').find().then(result => {
		const dogItem = result.items[0];
		if (dogItem.petName === userInputText) {

Regards,
Jason

4

Hay Jason,

Let me explain (and simplify a bit) the code Liran wrote -

export async function button1_click(event) { 
  // here we read the value from the input named textInput1
  const userInputText = $w('#textInput1').value; 	

  // here we query the database, to the collection myPets, with a condition that the field PetType equals Dog
  let result = await wixData.query('myPets').eq('petType', 'Dog').find();

  // the result has an array of items. we get the first item from the array
  const dogItem = result.items[0]; 

  // now we check if the petName from the database equals the petName entered by the user.
  if (dogItem.petName === userInputText) { 
    //Validation success - do something 
  } 
  else { 
    //Validation failure - do something else } 
  }  
}

On the second part - validation success and validation failure, you can navigate to another page using wixLocation or show a message using the show / hide APIs.

5

Thank you Yoav!

So for the location thing I’ve entered this:

wixLocation.to("https://navitocompany.wixsite.com/private");

The problem now is that within the

wixData.query('....')

the error I get is that wixData is undefined and I’m not sure to what that belongs to? Is it the title of the database?

Sorry for the confusion.

Regards,
Jason

6

Ah, I got that issue resolved by adding this to the page code:

import wixData from 'wix-data';

Nevertheless, when trying to do test it. I enter the correct input in the first textbox but when I push on the button nothing happens :frowning:

P.S. I do have this in my code as well :slight_smile:

   import wixLocation from 'wix-location';
7

Hay Jason,

Try the following - have in the first line of the button click function the navigation code. Lets see if it works.

export async function button1_click(event) {
  wixLocation.to("https://navitocompany.wixsite.com/private");
}

If it does, it means there is a problem with the function logic itself. The easiest way to understand that is to add console.log(‘some line comment’) calls to print stuff to the console, showing us what paths the code is running.

for instance, before the if line you can add a log of the parameters

console.log('before if', dogItem.petName, userInputText);
if (dogItem.petName === userInputText) {

Doing so will print, in the console, something like

before if Bob Bob