How to add condition to re-direct (wixLocation.to)

thomasbastock · November 27, 2020, 8:36pm

Hi all

I’m currently using this code below, to re-direct users to a specific page (application) after sign-up:

import wixLocation from ‘wix-location’ ;

export function registrationForm1_wixFormSubmit() {
wixLocation.to( “/application” );
}
export [function](function registrationForm1_wixFormSubmitted() {
wixLocation.to(“/application”);
}) [ registrationForm1_wixFormSubmitted() {](function registrationForm1_wixFormSubmitted() {
wixLocation.to(“/application”);
})
[ wixLocation.to(](function registrationForm1_wixFormSubmitted() {
wixLocation.to(“/application”);
}) [“/application”](function registrationForm1_wixFormSubmitted() {
wixLocation.to(“/application”);
}) [);](function registrationForm1_wixFormSubmitted() {
wixLocation.to(“/application”);
})
[}](function registrationForm1_wixFormSubmitted() {
wixLocation.to(“/application”);
})

I now want to find a way to add a condition. So…

If checkbox is ticked, go - wixLocation.to ( “/application” )
If checkbox is not ticked, then go - wixLocation.to ( “/alternatepage”)

Anyone know how I can do the above?

Thank you!

CODE-NINJA · November 27, 2020, 9:14pm

Ok, you want to

If checkbox is ticked, go - wixLocation.to ( “/application” )

If checkbox is not ticked, then go - wixLocation.to ( “/alternatepage”)
Where is the problem ?

how to make if-else-condition…

if (  X===5  ) {console.log ("X equals ---> 5")}
else {console.log ("X do NOT equals ---> 5")}

Then look at the API-Reference for CHECKBOXES here…

Which command could be used by you?
Perhaps this one ???

And here you will find how to use “wix-location”.

Now try to combine all of them together… (good luck)

something like this one…

import wixLocation from 'wix-location';

if ($w('#checkbox1').checked===true  ) {console.log ("CHECKBOX is CHECKED")}
else {console.log ("CHECKBOX is UNCHECKED")}

import wixLocation from 'wix-location';

if ($w('#checkbox1').checked===true  ) {console.log ("CHECKBOX is CHECKED"), wixLocation.to("/alternatepage")}
else {console.log ("CHECKBOX is UNCHECKED"), wixLocation.to("/application")}

thomasbastock · November 29, 2020, 2:47pm

Thank you Russian, this is exactly what I wanted.

I feel I’ve NEARLY got it, but i’m struggling to implement it into my code. Here is my current code:

import wixLocation from ‘wix-location’ ;
if ($w( ‘#checkbox1’ ).checked=== true ) {console.log ( “CHECKBOX is CHECKED” )}
else {console.log ( “CHECKBOX is UNCHECKED” )}

export function registrationForm1_wixFormSubmit() {
wixLocation.to( “/application” );
}
export function registrationForm1_wixFormSubmitted() {
wixLocation.to( “/application” );
}

So how would I add your code to this, so that the checkbox ticked/unticked changes the re-direct location?

Thank you!

CODE-NINJA · November 29, 2020, 3:19pm

@thomasbastock
Is this your whole code, or do something missing?

Where is your “onReady”?
When should your ACTION start? (by clicking a button, selecting a checkbox, or right from the beginning when the page loads?

I just see this here…

exportfunction registrationForm1_wixFormSubmit() {    wixLocation.to("/application");}exportfunction registrationForm1_wixFormSubmitted() {    wixLocation.to("/application");}

Where you are telling —> go to “application” when FORM submitted.
But there is no query of checked or unchecked boxes.

This example here is very similar to your problem. It just do not redirect somewhere, it disables and enbles a button when checked, or unchecked.

https://russian-dima.wixsite.com/meinewebsite/enable-button-check

Try to copy the functions and to modify to your own needs.

All you have to do is ----> instead of disabling and enabling of a button, you should redirect with “wix-location” to another page.

How to navigate you can see here…
https://russian-dima.wixsite.com/meinewebsite/website-navigation

thomasbastock · November 29, 2020, 3:38pm

I’ve editted the code a bit, it now looks like this:

// API Reference: https://www.wix.com/corvid/reference
// “Hello, World!” Example: https://www.wix.com/corvid/hello-world

$w.onReady( function () {
// Write your JavaScript here

// To select an element by ID use: $w(“#elementID”)

// Click “Preview” to run your code
});
import wixLocation from ‘wix-location’ ;

export function registrationForm1_wixFormSubmit() {
if ($w( ‘#checkbox1’ ).checked=== true ) {console.log ( “CHECKBOX is CHECKED” ), wixLocation.to( “/members-choice” )}
else {console.log ( “CHECKBOX is UNCHECKED” ), wixLocation.to( “/application” );
}}

export function registrationForm1_wixFormSubmitted() {
if ($w( ‘#checkbox1’ ).checked=== true ) {console.log ( “CHECKBOX is CHECKED” ), wixLocation.to( “/members-choice” )}
[else](else {console.log (“CHECKBOX is UNCHECKED”), wixLocation.to(“/application”);
}}) [ {console.log (](else {console.log (“CHECKBOX is UNCHECKED”), wixLocation.to(“/application”);
}}) [“CHECKBOX is UNCHECKED”](else {console.log (“CHECKBOX is UNCHECKED”), wixLocation.to(“/application”);
}}) [), wixLocation.to(](else {console.log (“CHECKBOX is UNCHECKED”), wixLocation.to(“/application”);
}}) [“/application”](else {console.log (“CHECKBOX is UNCHECKED”), wixLocation.to(“/application”);
}}) [);](else {console.log (“CHECKBOX is UNCHECKED”), wixLocation.to(“/application”);
}})
[}}](else {console.log (“CHECKBOX is UNCHECKED”), wixLocation.to(“/application”);
}})

Still not working though. The action is the (wixFormSubmit / wixFormSubmitted). Basically when they hit the submit button, the action should take place

thomasbastock · November 29, 2020, 3:55pm

Ok, looks like it worked! Mission success

Thank you Russian!

CODE-NINJA · November 29, 2020, 3:56pm

Please use code-tags to make your code better readable…like this…

// API Reference: https://www.wix.com/corvid/reference// “Hello, World!” Example: https://www.wix.com/corvid/hello-world$w.onReady(function () {// Write your JavaScript here// To select an element by ID use: $w("#elementID")// Click "Preview" to run your code});import wixLocation from'wix-location';exportfunction registrationForm1_wixFormSubmit() {if ($w('#checkbox1').checked===true  ) {console.log ("CHECKBOX is CHECKED"), wixLocation.to("/members-choice")}else {console.log ("CHECKBOX is UNCHECKED"), wixLocation.to("/application");}}exportfunction registrationForm1_wixFormSubmitted() {if ($w('#checkbox1').checked===true  ) {console.log ("CHECKBOX is CHECKED"), wixLocation.to("/members-choice")}else {console.log ("CHECKBOX is UNCHECKED"), wixLocation.to("/application");}}

As you can see, this happens when i try to copy your code (which was not edited with CODE-Tags) and paste it again into CODE-tags.

You surely do not want to read such a terrible CODE-STRUCTURE, right?

Ok, one more time…(this is your CODE…)

// API Reference: https://www.wix.com/corvid/reference
// “Hello, World!” Example: https://www.wix.com/corvid/hello-world

$w.onReady(function () {
 // Write your JavaScript here

 // To select an element by ID use: $w("#elementID")

 // Click "Preview" to run your code
});
import wixLocation from 'wix-location';

export function registrationForm1_wixFormSubmit() {
 if ($w('#checkbox1').checked===true  ) {console.log ("CHECKBOX is CHECKED"), wixLocation.to("/members-choice")}
 else {console.log ("CHECKBOX is UNCHECKED"), wixLocation.to("/application");
}}

export function registrationForm1_wixFormSubmitted() {
 if ($w('#checkbox1').checked===true  ) {console.log ("CHECKBOX is CHECKED"), wixLocation.to("/members-choice")}
 else {console.log ("CHECKBOX is UNCHECKED"), wixLocation.to("/application");
}}

At first, we DELETE all that unnecessary CODE-LINES

// API Reference: https://www.wix.com/corvid/reference
// “Hello, World!” Example: https://www.wix.com/corvid/hello-world

 // Write your JavaScript here

 // To select an element by ID use: $w("#elementID")

 // Click "Preview" to run your code

Then we give the code a better CODE-STRUCTURE…

import wixLocation from 'wix-location';

$w.onReady(function() {
 //.....your CODE here.......
})

GOOD-STRUCTURE !!!! ---> CODE is very good readable
export function registrationForm1_wixFormSubmitted() {
   if ($w('#checkbox1').checked===true  ) {
      console.log ("CHECKBOX is CHECKED"), wixLocation.to("/members-choice")
   }
   else {console.log ("CHECKBOX is UNCHECKED"), wixLocation.to("/application");
}

BAD-STRUCTURE !!!! ---> CODE gets less readable!
 export function registrationForm1_wixFormSubmit() {
 if ($w('#checkbox1').checked===true  ) {console.log ("CHECKBOX is CHECKED"), wixLocation.to("/members-choice")}
 else {console.log ("CHECKBOX is UNCHECKED"), wixLocation.to("/application");
}

Now we have a good CODE-STRUCTURE… (very good readable!)

import wixLocation from 'wix-location';

$w.onReady(function() {
 //.....your CODE here.......
})

GOOD-STRUCTURE !!!! ---> CODE is very good readable
export function registrationForm1_wixFormSubmitted() {
   if ($w('#checkbox1').checked===true  ) {
      console.log ("CHECKBOX is CHECKED"), wixLocation.to("/members-choice")
   }
   else {console.log ("CHECKBOX is UNCHECKED"), wixLocation.to("/application");}
}

BAD-STRUCTURE !!!! ---> CODE gets less readable!
export function registrationForm1_wixFormSubmit() {
   if ($w('#checkbox1').checked===true  ) {
     console.log ("CHECKBOX is CHECKED"), wixLocation.to("/members-choice")
   }
   else {console.log ("CHECKBOX is UNCHECKED"), wixLocation.to("/application");}
}

import…code-line is always on the very TOP of your CODE.

import wixLocation from 'wix-location';

do not mix EXPORT-FUNCTIONS with normal FUNCTIONS, or put them on wrong places

WRONG ! ! !
$w.onReady(function() {
   export function registrationForm1_wixFormSubmit() {
     if ($w('#checkbox1').checked===true  ) {
       console.log ("CHECKBOX is CHECKED"), wixLocation.to("/members-choice")
     }
     else {console.log ("CHECKBOX is UNCHECKED"), wixLocation.to("/application");}
    }
})

RIGHT-way ! ! !
$w.onReady(function() {
   
})

export function registrationForm1_wixFormSubmit() {
   if ($w('#checkbox1').checked===true  ) {
      console.log ("CHECKBOX is CHECKED"), wixLocation.to("/members-choice")
   }
   else {console.log ("CHECKBOX is UNCHECKED"), wixLocation.to("/application");}
}

There are 2-ways how to code…

a) This way, by using EXPORT-FUNCTIONS and connect them in your EDITOR.

export function registrationForm1_wixFormSubmit() {
   if ($w('#checkbox1').checked===true  ) {
      console.log ("CHECKBOX is CHECKED"), wixLocation.to("/members-choice")
   }
   else {console.log ("CHECKBOX is UNCHECKED"), wixLocation.to("/application");}
}

b)… ohhhhh ok, you already found a SOLUTION, well done!

But take a look of what i was writing here, it will help you a lot to understand coding better…

CODE-NINJA · November 29, 2020, 3:57pm

HOMEWORK for you

What is the coding way-B ???

thomasbastock · November 29, 2020, 5:21pm

Thanks Russian, as you can tell I’m very new to coding, so I appreciate the time you’ve taken to show me this. Thank you I’m glad I was able to resolve it.

CODE-NINJA · November 29, 2020, 5:23pm

You are welcome. Try to learn as most as possible.
Good luck & happy coding!

CODE-NINJA · November 29, 2020, 5:24pm

I see Ajit makes always his homework
Give us the B-way

CODE-NINJA · November 29, 2020, 5:27pm

One more thing. If you have found a working solution, perhaps you can share it with other users who also in future will search for it. In most cases, this will be also users which just have begun with Corvid-Coding.

thomasbastock · December 1, 2020, 11:36pm

Hmm, interesting, this re-direct doesn’t seem to work on mobile phone browsers, just desktop. Anyone know why?

This is the code I’m using:

});
import wixLocation from ‘wix-location’ ;

export function registrationForm1_wixFormSubmit() {
if ($w( ‘#checkbox1’ ).checked=== true ) {console.log ( “CHECKBOX is CHECKED” ), wixLocation.to( “/members-choice” )}
else {console.log ( “CHECKBOX is UNCHECKED” ), wixLocation.to( “/application” );
}}

export function registrationForm1_wixFormSubmitted() {
if ($w( ‘#checkbox1’ ).checked=== true ) {console.log ( “CHECKBOX is CHECKED” ), wixLocation.to( “/members-choice” )}
else {console.log ( “CHECKBOX is UNCHECKED” ), wixLocation.to( “/application” );
}}

thomasbastock · December 6, 2020, 11:06pm

Anyone know why this re-direct of mine (see code above) doesn’t seem to work on Mobile?

Topic		Replies	Views
Redirecting after Sign-up Ask the community code , question	1	199	November 23, 2020
One Submit Button going to one of 2 pages Ask the community code , question	1	117	November 23, 2018
If condition is met for string-> redirect to page Ask the community code , question	2	1662	September 2, 2018
redirect based on boolean value Ask the community code , wix-stores , question	3	406	September 9, 2019
Open a page after correctly sign up Ask the community code , question	3	153	August 31, 2021

How to add condition to re-direct (wixLocation.to)

Related topics