[SOLVED] Limit Google Autocomplete results to UK

Need help Database
1

I’ve read a few posts on this topic but can’t find the solution. I want to ensure my autocomplete returns addresses only in the UK (or at least favours the UK results).

It says here that I need to add the following HTML

function initialize() {
    var optionsT = {
        types: ['geocode'],
        componentRestrictions: {country: "uk"}
    };
 
    var autocompleteT = new google.maps.places.Autocomplete(document.getElementById('TarPlacename'), optionsT);
}

Here’s how I did it:

html
html934×543 33.8 KB

But this made no difference, still the majority of results are US based, until I have almost completed the UK address I am only shows foreign addresses?

Also, the HTML I added shows on the page, how do I make it invisible?

2

You need to add
“< script >”(without quotes and spaces) at the beginning and “</ script >”(without quotes and spaces) at the end to run the script.
You need to un-tick “This element is visible on page load” to make the HTML element invisible.

3

Thank you @maheshkasindi I did this and all looks good but still the UK addresses are not populating until much later than other territories. Maybe it’ll take a while to reset or something as I only just added the script tags.

4

Have you added ID to the searchbar element?

5

Working well for me. Very useful, thanks for sharing.

6

No, what should I put in the ID?

7

If you haven’t enabled the option of setting custom ID to elements, follow this thread and enable it

You should set ID to TarPlacename

8

Thanks, I had already enabled the ID element. I wasn’t sure if I have to add the ID to the HTML box and/or the form field.

Here are my results;

  1. No ID at all = UK addresses are not prioritised :-1:
  2. Adding the ID to the HTML box and the address form field = UK addresses are not prioritised :-1:
  3. Adding the ID to the HTML box only = autocomplete not working at all :-1:
  4. Adding the ID to the address form field only = autocomplete not working at all :-1:

Why can’t Google have simply allowed us to tick boxes to choose countries :roll_eyes:

Screenshot 2021-12-01 180450
Screenshot 2021-12-01 180450612×615 18.9 KB

10

Adding ID name to the search box alone should work

11

Thanks but it doesn’t do anything?

12

Did you get yours to only show UK addresses?

13

I’m curious to the pros and cons around using HTML like this as opposed to just using the native bubble search element, setting it to geographic places and using the native ‘limit results’ function of that element?

1 Like
14

Yes. I added an invisible HTML element, put the code inside this wrapped around the < script > tags (without spaces and the closing tag) and set the Element ID on the input to match that of the Javascript.

15

In my experience of using this, it doesn’t always work as expected. It also relies upon the user allowing location access in their browser.

16

Thanks @Steve_S Would you mind looking at the images below to check I have it set up like yours?

1
1923×566 30.4 KB

2
21062×586 34.5 KB

3
3996×557 35.8 KB

17

Where is there a ‘limit results’ function?

18

The only thing I see different is that I am hiding the HTML element.

19

Ok thanks, I did try both hidden and visible. I will have to try something else to get this to only show UK results (or at least prioritise them).

20

The only other things I can think of are to move the HTML element so that it is not overlapping anything else and to double-check your Google API settings (both in Bubble and Google API Dashboard to ensure that the necessary APIs are enabled there).

21

Thanks @Steve_S I will try that.