Jquery ui autocomplete with google sites - choosing strength and deleting the original input when moving up the down arrows

Question

I have a jquery ui autocomplete that grabs data from google places ...

The problem I am facing is that after the user starts browsing the list of offers using the up and down arrows, the original input will also appear at the end. I want to delete this original input, otherwise, if the user gets into the input form without forcing the selection ...

// Autocomplete location with google places API
    $("#edit_profile .location").autocomplete({
        source: function(request, response) {
            $.ajax({
                url: "/words/lib/ajax.php",
                type: "GET",
                data: "autocomplete_location=1&term=" + request.term,
                cache: false,
                success: function(resp) {
                    try {
                        json = $.parseJSON(resp);
                    } catch (error) {
                        json = null;
                    }
                    //
                    if (json && json.status == "OK") {
                        //
                        response($.map(json.predictions, function(item) {
                            return {
                                label: item.description,
                                value: item.description
                            }
                        }));
                        //
                    }
                }
            });
        },
        minLength: 1,
        change: function (event, ui) {
            if (!ui.item){
                $(this).val("");
            }
        }
    });

Answer 1

Are you worried about disabling the default action when clicked [Enter]when the autocomplete menu is displayed?

, : , , :

var $input = $('input[name="name"]');

$input.on('keydown', function(e) {
    if ( $(this).data('acShown') && e.which == 13 /*enter key*/){
        e.preventDefault();
    }
});
$input.autocomplete({
    source: function (request, response) {
        setTimeout(function () {
            $input.data('acShown', true); //set the flag when showing the menu
            response(data)
        }, 300);
    },
    close: function(){
        $input.data('acShown', false); //unset the flag on close
    }
});

: , , [Enter], , - .

Answer 2

, , , "focus" "change".

, :

// Autocomplete location with google places API
$("#edit_profile .location").autocomplete({
    source: function(request, response) {
        $.ajax({
            url: "/words/lib/ajax.php",
            type: "GET",
            data: "autocomplete_location=1&term=" + request.term,
            cache: false,
            success: function(resp) {
                try {
                    json = $.parseJSON(resp);
                } catch (error) {
                    json = null;
                }
                //
                if (json && json.status == "OK") {
                    //
                    response($.map(json.predictions, function(item) {
                        return {
                            label: item.description,
                            value: item.description
                        }
                    }));
                    //
                }
            }
        });
    },
    minLength: 1,
    focus: function (event, ui) {
        if (!ui.item){
            $(this).val("");
        }
    }
});

Answer 3

, , , smth . , , , didn 't , , .

, , ajax. , .

<ul class="ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all" role="listbox" aria-activedescendant="ui-active-menuitem" style="z-index: 1; top: 0px; left: 0px; display: block; width: 298px;">

.