Google Maps API Autocomplete

Question

I am using Google Maps API Autocomplete (Places API) and JavaScript.

How to run autocomplete after entering 3 characters?

this is my code:

function initAutocomplete() {
    var input = $('#autocomplete')[0];

    var autocomplete = new google.maps.places.Autocomplete(input);
    autocomplete.addListener('place_changed', {
        gPlace = autocomplete.getPlace();
    });

    var _addEventListener = (input.addEventListener) ? input.addEventListener : input.attachEvent;

    function addEventListenerWrapper(type, listener) {
        if (type == "keydown") {
            var orig_listener = listener;

            listener = function(event) {
                var suggestion_selected = $(".pac-item-selected").length > 0;

                if (event.which == 13 && !suggestion_selected) {
                    var simulated_downarrow = $.Event("keydown", {keyCode:40, which:40})
                    orig_listener.apply(input, [simulated_downarrow]);
                }

                orig_listener.apply(input, [event]);
            };
        }
        _addEventListener.apply(input, [type, listener]);
    }

    if (input.addEventListener) {
        input.addEventListener = addEventListenerWrapper;
    } else if (input.attachEvent) {
        input.attachEvent = addEventListenerWrapper;
    }
}

I hope I explained my problem clearly. Thank you in advance.

Answer 1

You can refer the below method to use of Google Maps API autocomplete feature after 3 characters:

function initAutocomplete() {
    var input = $('#autocomplete')[0];

    var autocomplete = new google.maps.places.Autocomplete(input);
    autocomplete.addListener('place_changed', {
        gPlace = autocomplete.getPlace();
    });

    var _addEventListener = (input.addEventListener) ? input.addEventListener : input.attachEvent;

    function addEventListenerWrapper(type, listener) {
        if (type == "keydown") {
            var orig_listener = listener;

            listener = function(event) {
                var suggestion_selected = $(".pac-item-selected").length > 0;

                if (event.which == 13 && !suggestion_selected) {
                    var simulated_downarrow = $.Event("keydown", {keyCode:40, which:40})
                    orig_listener.apply(input, [simulated_downarrow]);
                }

                orig_listener.apply(input, [event]);
            };
        }
        _addEventListener.apply(input, [type, listener]);
    }

    if (input.addEventListener) {
        input.addEventListener = addEventListenerWrapper;
    } else if (input.attachEvent) {
        input.attachEvent = addEventListenerWrapper;
    }
    return false;
}