jQuery Автозаполнение Категории Выберите метку и значение - PullRequest
18 голосов
/ 16 июля 2011

Попытка получить автозаполнение jQuery с категориями для возврата выбранного значения в поле поиска и значения в отдельное поле ввода.

Я изменил данные, чтобы они имели значение, а также метку и категорию.

См. http://jsfiddle.net/chrisk/bM7ck/

Но значение всегда возвращается в поле поиска вместо метки.

Ответы [ 3 ]

27 голосов
/ 16 июля 2011

Вот как работает автозаполнение jquery ui, когда вы указываете метку и значение.Если вы хотите, чтобы метка вернулась в поле поиска, переименуйте поле значения.

Обновленная скрипта: http://jsfiddle.net/jensbits/bM7ck/3/

21 голосов
/ 16 июля 2011

Ты рядом, тебе просто нужно:

  1. Добавьте return false в конец вашего select обработчика событий и
  2. Добавьте обработчик события для события focus, чтобы вы также могли его переопределить, используя вместо значения метку.

Вот ваш обновленный код:

$("#search").catcomplete({
    delay: 0,
    source: data,
    select: function(event, ui) {
        $('#search').val(ui.item.label);
        $('#searchval').val(ui.item.value);
        return false; // Prevent the widget from inserting the value.
    },
    focus: function(event, ui) {
        $("#search").val(ui.item.label);
        return false; // Prevent the widget from inserting the value.
    }
});

Вот обновленный пример: http://jsfiddle.net/q2kDU/

3 голосов
/ 24 августа 2012
$(function() {
        $( "#searchitems" ).autocomplete({
            source: [<?php echo $search /*example for full list in php*/?>],
            minLength: 2,
            select: function(event, ui) {
                event.preventDefault();
                $("#searchitems").val(ui.item.label);
                $('#searchitemvalue').val(ui.item.value);
                window.location="#"; //location to go when you select an item
            },
            focus: function(event, ui) {
                event.preventDefault();
                $("#searchitems").val(ui.item.label);
                $('#searchitemsvalue').val(ui.item.value);
            }
        });
    });
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...