Linking to another page code

Ask the community
,
1

Hello,

I am trying to connect a button to a progress bar and every time a member presses the button, their progress would go up by +5. I figured all of this out, however, when someone tries to click the button and go the next page it doesn’t work. For example, if someone was on page “Sanay” and needed to go to page “Vanay” it would not direct them. I am very confused and wanted to know what was the code that could get me onto another page. I have tried everything and I still can’t do it. Below is the code I am using.

$w.onReady( function () {
});
import wixLocation from ‘wix-location’ ;
export function button1_click_(event) {
$w( “#progressBar1” ).value = + 5 }

I have tried everything, can someone help me? If someone helps me and gives the code, can they also do an example using the “Sanay” and “Vanay” name for pages so I know where and how I need to do this?

2

https://www.wix.com/corvid/reference/wix-location.html#to

import wixLocation from 'wix-location';
$w.onReady(function () {

 });

export function button1_click_(event{
    $w("#progressBar1").value = +5 ;
    wixLocation.to("/Sanay"); 
}

or something like that… haven’t tried it but the logic is the same. or maybe u could put await/async just in case like that

import wixLocation from 'wix-location';
$w.onReady(function () {

 });

export async function button1_click_(event{
    await $w("#progressBar1").value = +5 ;
    wixLocation.to("/Sanay"); 
}
3

Hey man!

Thanks for getting back to me. Can you verify if it works, because I tried it on my website and it didn’t work. I put /Sanay and it doesn’t send me to page Sanay, can you please double check if what you sent me works? It would mean a lot to me!

4

First off, don’t create duplicate posts about the same issue.

As for your page url, make sure that you have a page which has the url of Sanay on your site, check that it is Sanay and not sanay or something else.

With the progress bar simply use Wix Storage to save the value of the progress bar before moving the user onto another page.

Then when the next page loads up you can simply get that value again and preset the progress bar with that value.

https://www.wix.com/corvid/reference/wix-storage.html

How do I pass data between pages in my site?
Use the wix-storage API. Use the setItem() function to place data in storage on the originating page. Then use the getItem() function to retrieve the data on the target page.

5

I am sorry for this, I understood the issue. However, I have come to another problem. When I click the button and it sends the +5 value to the progress bar, it does not save. So if someone goes to another page, and then back to the page with the progress bar, their value will show 0 instead of 5. Can you please help me?

6

That is where you use Wix Storage API as mentioned in previous reply to set that value into memory and when you move to the next page you get it from memory and set the value of the progress bar with that.

Otherwise, you save the value of the progress bar into a dataset with the onClick event before moving the user onto the next page and you can simply get the value for the progress bar from the dataset field on each page.

7

I don’t understand what the code would be for it. I tried using local, as it saves the data, but it still isn’t working. Can you please correct my code?

import wixLocation from ‘wix-location’ ;
$w.onReady( function () {

});
import {local} from ‘wix-storage’ ;
export function button1_click_(event){
$w( “#progressBar1” ).value = + 5 ;
local.setItem( “#progressBar1” , “+5” );
wixLocation.to( “/Sanay” );

local set item isnt working. It still isn’t saving.

8

First of all your code is all mixed up, your imports need to all be at the top of your page.

Then you simply need to set the value of your progress bar in the setItem code line.

Store an item in local storage

import {local} from 'wix-storage';

// ...

local.setItem("key", "value");

//so in your case it would be something like this....
local.setItem('progress', $w('#progressBar1').value);

Then you can simply recall that value in the getItem code line on the next page.

Retrieve an item from local storage

import {local} from 'wix-storage';

// ...

let value = local.getItem("key"); // "value"

//so in your case it would be something like this....  
const progress = local.getItem('progress');
$w('#progressBar1').value = progress;
9

I used the code

import wixLocation from ‘wix-location’ ;
import {local} from ‘wix-storage’ ;
$w.onReady( function () {

});
export function button1_click_(event){
$w( “#progressBar1” ).value = + 5 ;
local.setItem( ‘progress’ , $w( ‘#progressBar1’ ).value);
const progress = local.getItem( ‘progress’ );
$w( “#progressBar1” ).value = progress;
wixLocation.to( “/Sanay” );

}

I tried it, however, it gives me a SDK error code saying 5 cannot be a value and must be number. I dont know what to do.

10

I used the code

import wixLocation from ‘wix-location’ ;
import {local} from ‘wix-storage’ ;
$w.onReady( function () {

});
exportfunction button1_click_(event){
$w( " #progressBar1 " ).value = + 5 ;
local.setItem( ‘progress’ , $w( ’ #progressBar1 ’ ).value);
const progress = local.getItem( ‘progress’ );
$w( " #progressBar1 " ).value = progress;
wixLocation.to( “/Sanay” );

I tried it, however, it gives me a SDK error code saying 5 cannot be a value and must be number. I dont know what to do.