Hello Wix Team,
I am trying to make a page where the user inputs 2 fields and when the submit button is pressed, it checks those fields with a wix dataset and if it is matched then it should redirect to a dynamic page which is also from wix dataset
I have found this code till now
import wixData from ‘wix-data’ ;
import wixLocation from ‘wix-location’ ;
export function gg_click ( event , $w ) {
let username = $w ( ‘#name’ ). value ;
let password = $w ( ‘#lname’ ). value ;
wixData . query ( “Profile” )
. eq ( ‘firstName’ , username )
. eq ( ‘lastName’ , password )
//make sure the field names that you search in the query
//are the same as the actual fields in the data base.
. find ()
. then (( results ) => {
if ( results . items . length > 0 ) {
wixLocation.to(/profile/ + firstName);
// using the wix location API,
// make sure you return the full destination URL
}
})
. catch (( err ) => {
console . log ( “err” , err );
});
}
Screenshot:
Please Help me as I have to make this page urgently.
Thank you
The event handler stub on the right hand side for element “gg” looks for a function “BUTTON_click()”. But the function itself is called “gg_click()”.
even when i removed it, when i removed it and click the button, the function did not work.
Could you help me further?
You should not remove it, you should rename it to “gg_click”, so when that “gg” button is clicked, it looks up the function stub name (gg_click) and hurray, that function exists ( export function gg_click ( event , $w )).
Did This
But button is still not working when I enter data and click it in preview mode.
Is there something I am doing completely wrong?
@dhruavmathur That’s one of the problems that I have using Event Handlers. You are better of deleting this event handler and calling the method directly, without connecting to an event handler. Replace this:
export function gg_click(event, $w) {
}
To this:
$w("#gg").onClick(() => {
})
@bwprado still no luck mate. I am so confused with this. I have made one of the input types as password. Do you think that is the problem?
@dhruavmathur can you show me the code as it is right now?
And the event handler no the right side bar (Code Properties).
Try this code:
import wixData from "wix-data"
import wixLocation from "wix-location"
$w.onReady(() => {
$w("#gg").onClick(() => {
let username = $w("#name").value
let password = $w("#lname").value
wixData
.query("Profile")
.eq("firstName", username)
.eq("lastName", password)
//make sure the field names that you search in the query
//are the same as the actual fields in the data base.
.find()
.then(results => {
if (results.length > 0) {
wixLocation.to(`/profile/` + firstName)
// using the wix location API,
// make sure you return the full destination URL
}
})
.catch(err => {
console.log("err", err)
})
})
})
Remember to delete any event handler attached to the gg button.
still not working… it there any way i can contact you so that you can help me?
Database:
CODE:
Please do tell me if there is any way I can contact you so that I can get help for this since it is very important for me
As you can see from your screen shot, you have an error flagged. You are trying to use the variable firstName without declaring or setting it.
You will need to use the returned results from the database query to get the value of the firstName field. Something like this:
.then( (results) => {
if(results.items.length > 0) {
let firstItem = results.items[0]; // get the first (only?) item
let firstName = firstItem.firstName; // get the field we want
wixLocation.to(`/profile/`+ firstName)
} else {
// handle case where no matching items found
}
} )
Note that this has not been tested. The code is merely an illustration how to retrieve a specific field from an database item (row).
If you feel like you’re struggling with code, please visit the Wix Marketplace where you can find pro designers and developers to help you build your site.
Thank you but could you explain it more or help me write the code for it?
and firstName is not a variable but the ID of a field in the database. So I didn’t get what you mean by that.
I did write, and explain, the code for you already - at least the critical part that you need.
You should review the Wix Data documentation and play with the Velo database examples to learn how to use the Wix Database and the wix-data API .
What @yisrael-wix tried to tell you, was that you have an error flagged inside your code (I forgot to check that part of the code, sorry):
There you can see firstName being flagged because it was not defined.
Remove all of that code and put just a console.log(), like this:
.then(results => {
if (results.length > 0) {
console.log("The button has worked and something was found!")
console.log(`This was found: ${results.items}`)
}
else {
console.log("The button worked, but nothing was found!")
}
})
It should be like this:
import wixData from "wix-data"
import wixLocation from "wix-location"
$w.onReady(() => {
$w("#gg").onClick(() => {
let username = $w("#name").value
let password = $w("#lname").value
wixData
.query("Profile")
.eq("firstName", username)
.eq("lastName", password)
//make sure the field names that you search in the query
//are the same as the actual fields in the data base.
.find()
.then(results => {
if (results.length > 0) {
console.log("The button has worked and something was found!")
console.log(`This was found: ${results.items}`)
}
else {
console.log("The button worked, but nothing was found!")
}
})
})
})
Success!! The button works
Now how do I make it such so that it redirects to the dynamic page?
And you dont have to say sorry. You’re literally helping me a ton and I thank you for that.
Just help me add the dynamic page as well pleasee
@dhruavmathur you just have to follow what @yisrael-wix gave to you and replace the console.log() with his solution:
let firstItem = results.items[0]; // get the first (only?) item
let firstName = firstItem.firstName; // get the field we want
wixLocation.to(`/profile/${firstName}`)
Heyy so i added the dynamic page with just the username variable and thank you soo much for your help.
I had Another question though, is there a way i could find the primary key of the input the user has given and store that primary key in a variable?
@dhruavmathur anything that is connected to an element on the page can be retrieved and stored in a variable.
