проблем выбирая следующий пункт в автозаполнениях комбобокса

Question

У меня возникли некоторые трудности с этим списком:

http://jqueryui.com/autocomplete/#combobox

Я реализовал это на моем сайте, и он прекрасно работает, но я получаю грузы жалоб когда люди что-то выбрали, и они хотят перейти к следующему элементу в поле со списком. обычно вы нажимаете на комбинированное поле и нажимаете клавишу «вниз», но это не работает с этим конкретным кодом.

Я ищу, чтобы изменить этот код.

Я пробовал несколько вещей, например, пытаясь установить ориентацию ui-state из выпадающего списка на выбранный элемент, когда он показывает, но я не смог заставить это работать правильно. Я также попытался добавить полосу прокрутки в раскрывающееся меню, а затем установить выделение выделения на элементе.

В настоящее время я сделал «Hack», где я просто показываю исходный элемент и редактировал код, поэтому треугольник вниз этого поля отображается прямо рядом с полем ввода. Поэтому, когда пользователи нажимают на него, он получит исходное выпадающее меню без возможности его фильтрации, но он может просто использовать клавишу вниз или вверх для выбора следующего или предыдущего. К сожалению, это очень грязная, и я хотел бы, чтобы очистить его немного

$.widget("custom.combobox", { 
        _create: function() { 
         this.wrapper = $("<span>") 
          .addClass("custom-combobox") 
          .insertBefore(this.element); 
         this.element.width(5).addClass("showAllButton"); 
         this._createAutocomplete(); 
         this._createShowAllButton(); 
        }, 

Это то, что я пытаюсь возможно или мне нужно использовать другой компонент? если возможно, как мне его исправить?

Я хотел бы добавить, что опция фильтра/автозаполнения является обязательной.

Answer 1

Вы можете попробовать подобрать _source метод с текстом. Он откроет полный список опций, когда список не был виден до начала фильтрации, и это то, что вам нужно, когда коммандеры пользователя будут комбо и нажмите клавишу. Я не тестировал это решение для всех случаев, и я знаю, например, что это не будет выбирать значение, которое было ранее выбрано, но это начало :)

Если вам необходимо улучшить это, вы должны проверить autocomplete widget и как расширяйте его в соответствии с вашими потребностями.

this._source = function(request, response) { 
    var input = this.input; 
    var wasOpened = input.autocomplete("widget").is(":visible"); 
    var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i"); 
    response(this.element.children("option").map(function() { 
     var text = $(this).text(); 
     if (this.value && (!wasOpened || !request.term || matcher.test(text))) 
      return { 
       label: text, 
       value: text, 
       option: this 
      }; 
    })); 
}