WixLocation.to() and OnClick() event not behaving well

Ask the community
,
1

You can have a button open a link in a new website by setting the .link to the url, and .target to _blank – but as soon as you add an OnClick event to the button that no longer works.

You need OnClick to continue processing for the user. But the default behavior of the button craps out if you add it.

Furthermore WixLocation.to() does not work within OnClick to external websites; it would solve the problem if it could, but it does not behave well.

Does somebody have an answer, or workaround please. Or Wix if this is a ‘known issue’ please just tell me and I’ll stop banging my head on the wall.

Cheers, Tom

2

Hey!

Do you have an existing example of the issue you’re describing?
I’d extremely appreciate it if you could share a link to the page where you experience this issue so we could inspect it and offer a workaround if it is indeed an issue on our side.

Doron.

3

Hi Doron,

#spotifySelect is a simple button. The attributes for the button’s link are set to page and current window:


Link and target are programmatically inserted.

const playListBtn = $w("#spotifySelect");
//console.log(g_SpotifyData);
playListBtn.link = g_SpotifyData.location;
playListBtn.target = "_blank";

This button works fine when clicked by the user - it goes to Spotify in this case. But there’s a big issue if you need an OnClick() for further processing off the user’s button click.

On the properties panel, you add an OnClick() function:

So the code:

export function spotifySelect_click(event) {
let $item = $w.at(event.context);
let link = $item("#spotifySelect").link;
console.log(link)
wixLocation.to(link);
ExecuteMoreCodeNow('more');

}

When it fires, wixLocation.to does not open the target page, and the button does not open the target page…

If you removed the onClick() handler, then the button works. But this keeps ExecuteMoreCodeNow() from being executed - and this is the issue

Thanks,

Tom

4

Hey Tom.

Once wixLocation.to() is executed - the rest of the code is being ignored since it already started the process of moving you to the next page. Note that this is not an issue - it’s the expected outcome for the use of the API.

As for the other part of your query, I’ll have to see the entire page code in order to better understand the use case.
If you’d share a link to the page I’d be able to inspect the issue and provide you with more accurate assistance. (Rest assured that only authorized personnel can use this link in order to inspect your site - Wix employees).

Doron.

5

Hey Doron,

Thanks for getting back to me, appreciate it!

The page you can inspect is www.lovedintolife.com/music. Is this all you need?

The spotify select button is the one at issue, and what you’ll see is the button functioning because of this code being employed on the select button:

playListBtn.link = g_SpotifyData.location;
playListBtn.target = "_blank";

But again, if I create an event handler OnClick(), adding it via the properties panel to the button and code the handler below, wixLocation.to(‘mylink’) does nothing, but the console.log just after wixLocation executes:

export function spotifySelect_click(event) {
let $item = $w.at(event.context);
let link = $item("#spotifySelect").link;
wixLocation.to(link);  <--- DOESN'T OPEN ANYTHING
console.log('It is processing this console log');
}

in this event handler wixLocation.to() misbehaves.

Thanks for your help, much appreciated.

Tom

6

Hi Doron,

I figured out the issue. The onClick() does not work in preview mode, but it does work in published mode. And process continues…

However, wixLocation.to() does not have the capability to open the link in a new browser window, as there’s no way to pass along ‘_blank’ target. So that part of the api is misbehaving.

I will go back to using just the button/ linkmixin, and remove the onClick() event handler. I’ll revisit when this necessary feature of wixLocation.to() gets added.

Thanks, and be blessed,

Tom