Skip to Content (Press Enter)
2017-12-01 10-04-32
Tjaart Swanepoel
1226Views
7Comments
Solved
JavaScript Auto complete function for Google 
Question

Hi there,

I am trying to accomplish the same function as this simple html does, but can't seem to insert the right script in the right place, I might be missing something small.  

Thanks

index.7z
0
0
23 Oct 2017
Copy Link
2020-03-05 14-29-02
José Costa
Solution

Hi Tjaart

You can do it like this:

  • Add an input widget
  • Assign a variable to it
  • Give the name "Address" to the input widget (to be later used in the script below)
  • Add this xy Expression after the input widget with the Escape Content set to No:
"<script type=""text/javascript"" src=""https://maps.google.com/maps/api/js?sensor=false&libraries=places&language=en-AU""></script>
<script>
            var autocomplete = new google.maps.places.Autocomplete($('#" + Address.Id + "')[0], {});

            google.maps.event.addListener(autocomplete, 'place_changed', function() {
                var place = autocomplete.getPlace();
                console.log(place.address_components);
            });
</script>"

That should do it.

Cheers,

José

See solution in context
1
0
23 Oct 2017
Copy Link
UserImage.jpg
Christopher Adedeji

José Costa wrote:

Hi Tjaart

You can do it like this:

  • Add an input widget
  • Assign a variable to it
  • Give the name "Address" to the input widget (to be later used in the script below)
  • Add this xy Expression after the input widget with the Escape Content set to No:
"<script type=""text/javascript"" src=""https://maps.google.com/maps/api/js?sensor=false&libraries=places&language=en-AU""></script>
<script>
            var autocomplete = new google.maps.places.Autocomplete($('#" + Address.Id + "')[0], {});

            google.maps.event.addListener(autocomplete, 'place_changed', function() {
                var place = autocomplete.getPlace();
                console.log(place.address_components);
            });
</script>"

That should do it.

Cheers,

José

Hi Jose,

I've been using this script you put in place for my development. It's been working great but suddenly stopped providing auto complete suggestions today. Is there any idea on why this might happen ?


0
0
03 Jul 2018
Copy Link
2024-06-12 10-07-10
Daniel Martins


Hi Tjaart,

Could you please give more feedback or describe in detail what are you are trying to achieve?


0
0
23 Oct 2017
Copy Link
2017-12-01 10-04-32
Tjaart Swanepoel

Hi Daniel,

I am trying to achieve the following:

The code for this action look like this;

<!DOCTYPE html>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    </head>
    <body>
        <input type="text" id="address" style="width: 500px;"></input>

        <script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=false&libraries=places&language=en-AU"></script>
        <script>
            var autocomplete = new google.maps.places.Autocomplete($("#address")[0], {});

            google.maps.event.addListener(autocomplete, 'place_changed', function() {
                var place = autocomplete.getPlace();
                console.log(place.address_components);
            });
        </script>
    </body>
</html>



0
0
23 Oct 2017
Copy Link
2020-03-05 14-29-02
José Costa
Solution

Hi Tjaart

You can do it like this:

  • Add an input widget
  • Assign a variable to it
  • Give the name "Address" to the input widget (to be later used in the script below)
  • Add this xy Expression after the input widget with the Escape Content set to No:
"<script type=""text/javascript"" src=""https://maps.google.com/maps/api/js?sensor=false&libraries=places&language=en-AU""></script>
<script>
            var autocomplete = new google.maps.places.Autocomplete($('#" + Address.Id + "')[0], {});

            google.maps.event.addListener(autocomplete, 'place_changed', function() {
                var place = autocomplete.getPlace();
                console.log(place.address_components);
            });
</script>"

That should do it.

Cheers,

José

1
0
23 Oct 2017
Copy Link
UserImage.jpg
Christopher Adedeji

José Costa wrote:

Hi Tjaart

You can do it like this:

  • Add an input widget
  • Assign a variable to it
  • Give the name "Address" to the input widget (to be later used in the script below)
  • Add this xy Expression after the input widget with the Escape Content set to No:
"<script type=""text/javascript"" src=""https://maps.google.com/maps/api/js?sensor=false&libraries=places&language=en-AU""></script>
<script>
            var autocomplete = new google.maps.places.Autocomplete($('#" + Address.Id + "')[0], {});

            google.maps.event.addListener(autocomplete, 'place_changed', function() {
                var place = autocomplete.getPlace();
                console.log(place.address_components);
            });
</script>"

That should do it.

Cheers,

José

Hi Jose,

I've been using this script you put in place for my development. It's been working great but suddenly stopped providing auto complete suggestions today. Is there any idea on why this might happen ?


0
0
03 Jul 2018
Copy Link
2017-12-01 10-04-32
Tjaart Swanepoel

Worked first time, thanks so much...now, off to the next issue   

0
0
23 Oct 2017
Copy Link
UserImage.jpg
Christopher Adedeji

Just wanted to say Thanks for this. Amazing 

0
0
14 Jun 2018
Copy Link
2020-03-05 14-29-02
José Costa

Hi Christopher,

Not sure why it stopped working. It should still work.

Can you share your implementation to check it?

Cheers,

José

0
0
06 Jul 2018
Copy Link
Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.