Problem with data and typeahead

[victorh1705]

I would like to use Google Places API Web Service to find cities around the world using Bootstrap-3-Typeahead. But I'm stuck right here.

HTML

           <form name="google">

                <label for="cities">Cities</label>
                <input type="text" class="form-control"
                id="cities" placeholder="cities" data-provide="typeahead"/>

            </form>

JS

        var $input = $('#cities');
            $input.typeahead({
                source:function (query) {
                    var ajaxResponse;
                        $.get({
                            url: "https://maps.googleapis.com/maps/api/place/autocomplete/json?input="+query+"&types=(cities)&language=pt_BR&key=mykey",
                            success : function (response) {console.log(response);
                                ajaxResponse = response;
                            },
                        });
                    return ajaxResponse;

                },

            },'json');

        $input.change(function() {
            var current = $input.typeahead("getActive");
            if (current) {
                // Some item from your model is active!
                if (current.name == $input.val()) {
                    // This means the exact match is found. Use toLowerCase() if you want case insensitive match.
                } else {
                    // This means it is only a partial match, you can either add a new item 
                    // or take the active if you don't want new items
                }
            } else {
                // Nothing is active so it is a new value (or maybe empty value)
            }
        });  

[andreich1980]

Hello. Did you try this? source:function (query, process) { ...

success : function (response) {
                                console.log(response);
                                ajaxResponse = response;
                                return process(response);
                            },