[SOLVED]Search Text/Value in Google Single Click

Ask the community
,
1

Ive implemented code to search google with a custom search value from a user input. It works, but I have to click the button twice to open the google search. The first click updates the button’s link, then the 2nd click goes to the link. How am I able to do this with just 1 click instead of 2?

Ive also tried to set the button link through the input box’s OnChange() function, but the user still has to click outside the box for the event to trigger, then click the button to go to the link, so it still requires 2 clicks.

Here is my code:

$w.onReady(function () {
    $w('#bSearch').onClick((event) => {
        let query = 'http://www.google.com/search?q=' + $w('#tCountry').value + "+Government+Travel+Advisory";
        $w('#bSearch').link = query;
        $w('#bSearch').target = "_blank";
    })
});

Any help would be greatly appreciated!

2

The code in your onClick() event handler sets the link for the button only after you have clicked the button. So, the first time you click the button it sets that link , and the second time you click the button it then redirects to the link .

You don’t need an onClick() function. All you really need to do is set the link and target in the onReady() function. Something like this:

$w.onReady(function () {
        let query = 'http://www.google.com/search?q=' + $w('#tCountry').value + "+Government+Travel+Advisory";
        $w('#bSearch').link = query;
        $w('#bSearch').target = "_blank";
});

If you have a case where #tCountry changes, then you can set the button’s link property in the event handler that handles the change in value of #tCountry.

3

Thanks for the reply, Yisrael!

The issue is that I need the user input to determine where the link goes. It’s linked to a google search, where a user types in the country name of their choice (in input box #tCountry), then clicks ‘search’ (using the button #bSearch). So I cant set the button’s link until after they type in the country they want to search.

As you mentioned in the end, I can handle this event through #tCountry’s OnChange() function, but this is only triggered after clicking outside the box. So if that click is on the button, the onClick() function is called before the OnChange() function is called, which would appear to the user as a broken button unless they clicked a 2nd time.

I can’t really set a default link to the button before the user types in a country either, because if they type something in then click the button, it will go to the default link, then set the button to the correct link after it’s already opened. Similarly if the user were to change the country name in the input box several times, the button’s link would “lag” and send the user to the previous country on first click, if that makes sense?

Is there a way to set the link and go to the link in the same function? Preferably without using the wixLocation.to() function, so that I may open it in a new tab

4

[ANSWER]
I’ve solved the problem. I used the onInput() function to update the button link as the user types. Everything works as it should!

$w.onReady(function () {
    $w('#tCountry').onInput((event) => {
 let query = 'http://www.google.com/search?q=' + $w('#tCountry').value + "+Government+Travel+Advisory";
        $w('#bSearch').link = query;
        $w('#bSearch').target = "_blank";
    })
});