2016-07-18 2 views
0

У меня есть динамическое поле ввода, созданное с именем класса в качестве подкатегории. Нажатие клавиши автозаполнения работает нормально, из которого я могу выбрать один.jquery autocomplete Как установить метку и как получить значение?

Рабочий код, который находится ниже

$("body").on('keypress', 'input.sub-category', function() { 
     var availableTags = [ 
      {label:"ActionScript", value:"1"}, 
      {label:"ActionScript1", value:"11"}, 
      {label:"ActionScript2", value:"12"}, 
      {label:"ActionScript3", value:"13"}, 
      {label:"ActionScript4", value:"14"}, 
     ]; 
     $(this).autocomplete({ 
      source: availableTags, 
     }); 
    }); 

Когда я выбрать один из autosuggested текста сказать «ActionScript», это значение (1) должны быть доступны в коде ниже, как я могу получить к нему доступ? Функция выбора предупреждений работает нормально, поэтому просто нужно знать, как получить доступ к значению выбранной метки.

$("body").on('autocompleteselect', 'input.sub-category', function() { 
     alert('here'); 
}); 

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

ответ

1

вам необходимо включить JQuery-UI файл "https://code.jquery.com/ui/1.12.0/jquery-ui.js" в файле и просто заменить

$("body").on('autocompleteselect', 'input.sub-category', function() { 
     alert('here'); 
}); 

со следующими линиями.

$("body").on('autocompleteselect', 'input.sub-category', function (event,ui)  { 
    alert(ui.item.label); 
    alert(ui.item.value); 

}); 

и

$(this).autocomplete({ 
     source: availableTags, 
    }); 

с

$(this).autocomplete({ 
     source: availableTags, 
     select:function(event,ui){ 
      $(".sub-category").val(ui.item.label);return false; 
     } 
    }); 

и это будет прекрасно работать для получения дополнительной информации, пожалуйста, перейти на следующую ссылку

http://api.jqueryui.com/autocomplete/

+0

ReferenceError: ui не определен. Я получил эту ошибку, когда попытался. – user866933

0

Более легко!

Это здесь http://api.jqueryui.com/autocomplete/#event-select
И он говорит, что вы можете связать обработчик таким образом

$(".selector").on("autocompleteselect", function(event, ui) {});

где ui находится объект, который имеет item, который, в свою очередь, выбранный label и value данных.

Смежные вопросы