Как запустить событие place_changed для автозаполнения Google в поле "Enter"

Кажется, что щелчок запускает событие и устанавливает файлы cookie, но нажатие клавиши ввода для отправки не устанавливает файлы cookie, а вместо этого перенаправляет страницу без файлов cookie.

function locationAuto() {
        $('.search-location').focus(function () {
        autocomplete = new google.maps.places.Autocomplete(this);
        searchbox = this;

        google.maps.event.addListener(autocomplete, 'place_changed', function () {
            var thisplace = autocomplete.getPlace();
            if (thisplace.geometry.location != null) {
                $.cookie.raw = true;
                $.cookie('location', searchbox.value, { expires: 1 });
                $.cookie('geo', thisplace.geometry.location, { expires: 1 });
            }
        });
});

Местоположение .search - это класс для нескольких текстовых полей. Существует кнопка отправки, которая принимает значения из файлов cookie и перенаправления (на стороне сервера).

Ответ 1

Адаптировано из ответа Джонатана Колфилда:

$('.search-location').keypress(function(e) {
  if (e.which == 13) {
    google.maps.event.trigger(autocomplete, 'place_changed');
    return false;
  }
});

Ответ 2

Оба вышеупомянутых ответа являются хорошими ответами на общий вопрос об увольнении вопроса, когда пользователь нажимает "вводить". Тем не менее - я столкнулся с более конкретной проблемой при использовании автозаполнения Google Адресов, которые могли быть частью проблемы OP. Для события place_changed, чтобы сделать что-нибудь полезное, пользователь должен выбрать один из вариантов автозаполнения. Если вы просто запускаете 'place_changed', блок if() пропускается и cookie не устанавливается.

Здесь очень хороший ответ на вторую часть вопроса: fooobar.com/questions/108039/...

ПРИМЕЧАНИЕ. Ответ amirnissim, а не выбранный ответ, тот, который будет использоваться по причинам, на которые вы столкнетесь, если у вас более одной записи автозаполнения на той же странице.

Ответ 3

Я тоже столкнулся с этой проблемой и придумал хорошее решение. На моем веб-сайте я хотел сохранить autocomplete.getPlace(). Formatted_address в скрытом вводе перед отправкой. Это срабатывало, как ожидается, при нажатии кнопки отправки формы, но не при нажатии клавиши Enter при выборе в раскрывающемся меню автозаполнения. Мое решение было следующим:

$(document).ready(function() {

    // Empty the value on page load
    $("#formattedAddress").val("");
    // variable to indicate whether or not enter has been pressed on the input
    var enterPressedInForm = false;

    var input = document.getElementById("inputName");
    var options = {
      componentRestrictions: {country: 'uk'}
    };
    autocomplete = new google.maps.places.Autocomplete(input, options);

    $("#formName").submit(function(e) {
        // Only submit the form if information has been stored in our hidden input
        return $("#formattedAddress").val().length > 0;
    });

    $("#inputName").bind("keypress", function(e) {
        if(e.keyCode == 13) {
            // Note that simply triggering the 'place_changed' event in here would not suffice, as this would just create an object with the name as typed in the input field, and no other information, as that has still not been retrieved at this point.

            // We change this variable to indicate that enter has been pressed in our input field
            enterPressedInForm = true;
        }
    });

    // This event seems to fire twice when pressing enter on a search result. The first time getPlace() is undefined, and the next time it has the data. This is why the following logic has been added.
    google.maps.event.addListener(autocomplete, 'place_changed', function () {
        // If getPlace() is not undefined (so if it exists), store the formatted_address (or whatever data is relevant to you) in the hidden input.
        if(autocomplete.getPlace() !== undefined) {
            $("#formattedAddress").val(autocomplete.getPlace().formatted_address);
        }
        // If enter has been pressed, submit the form.
        if(enterPressedInForm) {
            $("#formName").submit();
        }
    });
});

Это решение работает хорошо.

Ответ 4

Возможно, это не самое удобное для пользователя решение, но вы можете использовать JQuery для отключения нажатия клавиши ввода.

Что-то вроде этого...

$('.search-location').keypress(function(e) {
  if (e.which == 13) {
    return false;
  }
});