Linking A Button To Dynamic Page Through Code

Hai everyone,

What I am trying to achieve is to link a button to dynamic page.
After the user is logged in, a button shows and that button should navigate the user to the respective dynamic pages.

My existing code is

import wixUsers from 'wix-users';
import wixData from 'wix-data';
import wixLocation from 'wix-location';
$w.onReady(function () {
 if(wixUsers.currentUser.loggedIn === true) {
    $w('#text1').hide();
    $w('#text9').hide();
    $w('#button1').show();  // this button navigates to the dynamic page
    $w('#text15').show();
}
else{
    $w('#text1').show();
    $w('#text9').show();
    $w('#button1').hide();  // this button navigates to the dynamic page
    $w('#text15').hide();
}

});

Database – ‘UserProfileData’

Thanks,
Ajith

Hey Ajith,

I can see that you imported wixLocation but you haven’t used it on the button.

You can create a button onClick() event that uses the to() function from the wix-location API.

Hope this helps!

Dara | Corvid Team

Hai Dara,
I know to create the wixlocation to function. But I couldn’t navigate to the dynamic page.
I don’t know the code

import wixLocation from ‘wix-location’;

wixLocation.to(dynamicpage + fullname);

My dynamic page’is id is userprofilepage/fullName // field from database

Aim → Make a query that matches the current userid to the databse UserProfileData and get the user dynamic link and navigate that user to that link.

Thanks,
Ajith

This post could be helpful to you, it looks like they were able to solve the problem.

Hi everyone,
The following is my code and is not working properly. Kindly (can you) point out the mistake …

export function button1_click(event) {

let user = wixUsers.currentUser;
let userId = user.id;           
console.log(userId);
wixData.query("UserProfileData")
  .eq("userId", userId)
  .find()
  .then( (results) => {
 if(results.items.length > 0) {
 let items1 =  results.items.userId;
 let id = `${items1}`
 

     wixLocation.to(`/userprofiledata/ + id`);

     } else {

      console.log("nothing");

    }

  } )
      .catch( (error) => {

 let errorMsg = error.message;

 let code = error.code;
    console.log(errorMsg);
    console.log(code);

  } );
 

 
}

Here

Thanks,
Ajith

wixLocation . to ( /userprofiledata/${item1} );

this should work

Hai John Kellen Menor

I have tried your code but not working !!!

import function button1_click(event) {

let user = wixUsers.currentUser;
let userId = user.id;           
console.log(userId);
wixData.query("UserProfileData")
  .eq("userId", userId)
  .find()
  .then( (results) => {
 if(results.items.length > 0) {
 let items1 =  results.items.userId;
 let id = `${items1}`
 

     wixLocation.to(`/userprofiledata/${items1}`);

     } else {

      console.log("nothing");

    }

  } )
      .catch( (error) => {

 let errorMsg = error.message;

 let code = error.code;
    console.log(errorMsg);
    console.log(code);

  } );
 

 
}

Anyone??

Hey @ajithkrr :raised_hand_with_fingers_splayed:

You need to provide more details, what are the fields that are used to build the URL? Is it the profile ID of the member? And if that’s true, are you using the built-in user ID?

Thanks Ahmad !
I got the solution from your answer in this post →

https://www.wix.com/corvid/forum/community-discussion/wixdata-query

The code should have been like this →

export function button1_click(event) {

let user = wixUsers.currentUser;
let userId = user.id;           
console.log(userId);
wixData.query("UserProfileData")
  .eq("userId", userId)
  .find()
  .then( (results) => {
 if(results.items.length > 0) {
 let items1 =  results.items[0].userId;
 let id = `${items1}`
 

     wixLocation.to(`/userprofiledata/${items1}`);

     } else {

      console.log("nothing");

    }

  } )
      .catch( (error) => {

 let errorMsg = error.message;

 let code = error.code;
    console.log(errorMsg);
    console.log(code);

  } );
 

 
}
let items1 =  results.items[0].userId;

Thanks Again !

@ajithkrr You’re welcome :wink: And sorry for the late reply …

Linking a button to dynamic page can also be done like →

let user = wixUsers.currentUser;
let userId = user.id; 
 
    wixData.query("UserProfileData")
  .eq("userId", userId)
  .find()
  .then( (results) => {
 if(results.items.length > 0) {
 let items = results.items[0]['link-userprofiledata-all']; //       this is the field of link. 
   
      console.log("let items is " + items);
 let id = `${items}`
      console.log("let id is " + id);

    wixLocation.to(`${items}`);
    } 

  } );

That’s true, thanks for sharing with others @ajithkrr :blush: Much appreciated.