Jquery Автозаполнение с Джанго - PullRequest
5 голосов
/ 08 июня 2011

Я пытаюсь выполнить поиск некоторых элементов с помощью автозаполнения jquery ui в приложении django.Я посмотрел на этот вопрос , и я следую точно так же, как документ автозаполнения.Меня не интересуют плагины или что-то еще.Я получил это.

В views.py:

def search_view(request):
    q = request.GET['term']
    ret = []
    listado = Model.objects.filter(descripcion__istartswith=q).order_by("descripcion")
    for l in listado:
        ret.append({'label':l.descripcion, 'value':l.id})
    return HttpResponse(simplejson.dumps(ret), mimetype='application/json')

В моем шаблоне у меня есть что-то вроде этого

js:

$("#auto_material").autocomplete({
                source:'{% url search_view %}',
                minLength: 2,
                select: function( event, ui ) {
                    $("#auto_material").val(ui.item.label);
                    $("#id_material").val(ui.item.value);
                }

            });

html:

<input type="text" id="auto_material" name="material" class="campo" style="width:99%;"/>
<input type="hidden" id="id_material" />

Все в поиске элементов работает нормально, но когда я пытаюсь установить значение ввода текста с помощью ui.item.label, он продолжает ставить ui.item.valueпри вводе текста, а не надписи.

Есть идеи?Перезаписывается ли событие «select» в объекте автозаполнения?Есть идеи?

Заранее спасибо.

1 Ответ

3 голосов
/ 08 июня 2011

Из документации автозаполнения :

Свойство метки отображается в меню предложений.Значение будет вставлено в элемент ввода, когда пользователь выберет элемент.

И для select обратного вызова :

Срабатывает, когдаэлемент выбирается из меню.Действие по умолчанию заключается в замене значения текстового поля значением выбранного элемента.

Отмена [sic] этого события предотвращает обновление значения, но не препятствует закрытию меню.

Акцент мой (орфографическая ошибка их).В исходном коде автозаполнения jQuery-UI мы находим следующее:

if ( false !== self._trigger( "select", event, { item: item } ) ) {
    self.element.val( item.value );
}

Таким образом, виджет установит значение ввода текста на item.value после того, как ваш обработчик события select вернется.Если, конечно, (как отмечено в документации выше) ваш обработчик событий возвращает false.Попробуйте настроить обработчик select так:

select: function( event, ui ) {
    $("#auto_material").val(ui.item.label);
    $("#id_material").val(ui.item.value);
    return false;  // <--------------------- Add this
}

Это задокументированное поведение, поэтому оно должно быть безопасным.

...