Maryna Brodina
Posts: 0
Joined: Thu Apr 05, 2012 7:27 am

Google Maps Api AutoComplete

Hello!
[quote:]Could it be because I'm re-adding the full maps+autocomplete js instead of just the autocomplete?[/quote]
yes, looks like the problem because of re-adding the full maps+autocomplete

Try do not use this autocomplete, for example use jquery plugin http://jqueryui.com/autocomplete/ or any similar plugin.

Rommel Paras
Posts: 0
Joined: Fri Jun 14, 2013 2:58 am

Google Maps Api AutoComplete

Yes, I've used that in tandem with the following steps:

  1. Autocomplete suggestions by using this API:

    Code: Select all

     
     [url=https://maps.googleapis.com/maps/api/place/autocomplete/json?types=establishment&radius=5000&sensor=true&key]https://maps.googleapis.com/maps/api/...[/url]=... and wrapped in our domain to extract {label:value} pair. 
     
  2. Importing the JQueryUI library to External Resources]:

    Code: Select all

     
     [url=http://code.jquery.com/ui/1.10.3/jquery-ui.js]http://code.jquery.com/ui/1.10.3/jque...[/url] 
     
  3. Creating two autocomplete input fields on

    Code: Select all

     
     [url=http://appery.io/app/view/b7685864-bd8e-4c7b-b6ec-83dd0251e5fb/SlidePage.html]http://appery.io/app/view/b7685864-bd...[/url] 
     

    The first one pulls data from [1] and targeted using the textbox's id. The second one pulls data from a local array and targeted using the textbox's class. Neither one works.

    Any thoughts?

Kateryna Grynko
Posts: 0
Joined: Thu Nov 15, 2012 9:13 am

Google Maps Api AutoComplete

Hi Rommel,

1) You shouldn't use $(document).ready() or $(function(){});
Read more here: http://api.jquerymobile.com/pageinit/

2) You connect several files that can conflict:
http://code.jquery.com/ui/1.10.3/jque...
files/views/assets/js/jquery.autocomplete.js

Look at this example please http://jsfiddle.net/aartyukh/2LK9H/1/

Here is the Google maps JavaScript connected. If you already use Google Maps on your page, then you do not need to connect it. All you need to connect is jQueryUI. At the same time, I strongly recommend you to collect your own assembly of the library on the following link:
http://jqueryui.com/download/#!versio...
There have already been selected only the necessary components, so you will significantly reduce the size of the library.

Rommel Paras
Posts: 0
Joined: Fri Jun 14, 2013 2:58 am

Google Maps Api AutoComplete

Thanks for the insights on #1 and #2.

I'm still trying to figure out the autocomplete issues on jsFiddle (http://jsfiddle.net/aartyukh/2LK9H/1/ ).

When I go to the page and copy the code, I see a reference error:
on jsFiddle: http://prntscr.com/1fevks
on Appery (maps.google... has been imported as an external resource):
http://prntscr.com/1fevs4

Maryna Brodina
Posts: 0
Joined: Thu Apr 05, 2012 7:27 am

Google Maps Api AutoComplete

Hello! There is an error:
in 2nd line you define codewindow.ServiceGeoCoder = function( $base ) {/code
in 91st codewindow.geocoder_auto = ServiceiGeoCoder( $("#autocomplete_form") );/code

(Service and Servicei)

Rommel Paras
Posts: 0
Joined: Fri Jun 14, 2013 2:58 am

Google Maps Api AutoComplete

Hi Marina,

Thanks for the correction. I was able to make the autocomplete work on jsFiddle.

However, I have two problems with this autocomplete solution:

  1. It is not very accurate. Typing 'facebook' only provides 1 result: (http://jsfiddle.net/rpparas/3XASp/3/) http://prntscr.com/1flxm0

  2. Unlike the default Google Maps autocomplete code:
    var autocomplete = new google.maps.places.Autocomplete(input, options);

    The country code (e.g. US only) and results (establishments only) shown by the Geocoder autocomplete are much harder to control.

    If there's no work around this problem, this is kinda a deal-breaker for us between going Native vs. Appery vs Sencha.

Maryna Brodina
Posts: 0
Joined: Thu Apr 05, 2012 7:27 am

Google Maps Api AutoComplete

Hello! It's not the problem of Native vs. Appery vs. Sencha. This is how Geocoder google service works. There is nothing we can do...

Rommel Paras
Posts: 0
Joined: Fri Jun 14, 2013 2:58 am

Google Maps Api AutoComplete

Why can't I use this?
var autocomplete = new google.maps.places.Autocomplete(input, options);

Kateryna Grynko
Posts: 0
Joined: Thu Nov 15, 2012 9:13 am

Google Maps Api AutoComplete

Hi Rommel,

You can. But then you would need to completely give up Appery.io Google Maps component and connect Google Maps yourself. The way to do this was discussed above.

Rommel Paras
Posts: 0
Joined: Fri Jun 14, 2013 2:58 am

Google Maps Api AutoComplete

How do I do that? Which files do I delete?

Return to “Issues”