Автозаполнение JQuery UI; minLength: 0 выпуск
Я использую автозаполнение JQuery UI. Я указываю минимальную длину. Если я укажу minLength:2
, мне нужно ввести 2 символа перед запуском службы. Если я укажу minLength:1
, тогда мне нужно только набрать один символ перед запуском службы источника.
Однако, когда я указываю minLength:0
, мне все равно нужно набрать один символ. Итак, в чем смысл 0
? как он отличается от 1
? Ожидаемое и желаемое поведение должно было бы срабатывать, как только фокус ввода...?
Идеи?
Обновление:. По большей части решение karim ниже работает, однако при нажатии на входные параметры появляются параметры и когда один щелкнут, источник повторно отправляет пустую строку, а не новую опцию, которая была просто выбранные, поэтому параметры автозаполнения, которые появляются после выбора опции, такие же, как если бы поле было пустым.
Ответы
Ответ 1
Ознакомьтесь с search
:
Запускает событие поиска, которое, когда доступны данные, затем отобразится предложения; могут быть использованы selectbox-like, чтобы открыть предложения при нажатии. Если нет значения аргумент указан, текущий используется входное значение. Можно назвать с пустой строкой и minLength: 0 для отображения всех элементов.
var source = ['One', 'Two', 'Three', 'Four'];
var firstVal = source[0];
$("input#autocomplete").autocomplete({
minLength: 0,
source: source,
}).focus(function() {
$(this).autocomplete("search", $(this).val());
});
.ui-menu-item{
background : rgb(215, 215, 215);;
border : 1px solid white;
list-style-type: none;
cursor : pointer;
}
.ui-menu-item:hover{
background : rgb(200, 200, 200);
}
.ui-autocomplete{
padding-left:0;
margin-top : 5px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.js"></script>
<input id="autocomplete"/> <input id="submit" type="submit"/>
Ответ 2
Я понимаю через эксперимент, почему принятый ответ (я проголосовал) можно считать немного неполным. Я добавил немного намерения сделать UX более комбо-подобным:
$('#Carrier').autocomplete(
{
source: '@Url.Action("AutocompleteCarrier", "Client")',
minLength: 0,
select: function (event, data) {
$(this).autocomplete('disable');
}
})
.blur(function(){
$(this).autocomplete('enable');
})
.focus(function () {
$(this).autocomplete('search', '');
});
Ответ 3
У меня была такая же проблема, и я решил ее таким образом. Я думаю, что приведенный ниже код значительно упрощает то, что текст, который отправляется службе автозаполнения, когда поле получает фокус. В частности, понятно, почему он работает, когда поле уже содержит что-то.
$(function() {
$("input#autocomplete").autocomplete({
source: "completion.html",
minLength: 0,
select: function( event, ui ) {}
});
});
$("input#autocomplete").focus(function() {
$(this).autocomplete("search", $(this).val());
});
Ответ 4
Это действительно работает! Протестировано на IE, FireFox
$("input#autocomplete").autocomplete({
minLength: 0,
source: source,
}).focus(function() {
setTimeout( "if ($('#input#autocomplete').val().length == 0) $('#input#autocomplete').autocomplete(\"search\", \"\"); ",1);
});
Ответ 5
У меня была та же проблема, и я получил способ решения этой проблемы.
Проблема в том, что при выборе опции вход будет сфокусирован, это будет работать search
без фильтра и снова отобразит autocomplete
.
Эта проблема не возникает, если вы выбираете клавиатуру, потому что input
уже находится в фокусе, поэтому код, который находится внутри focus
, не будет работать снова.
Поэтому, чтобы решить эту проблему, мы должны знать, когда фокус запускается с помощью любого события mouse/keyboar.
jQuery("input#autocomplete").focus(function(e) {
if(!e.isTrigger) {
jQuery(this).autocomplete("search", "");
}
e.stopPropagation();
});
e.isTrigger
используется jQuery
для идентификации, когда event
был запущен автоматически или пользователем.
рабочая демонстрация
Ответ 6
меню предложений появляется во второй раз, потому что нажатие на элемент в меню предложений вызывает текстовое поле для восстановления фокуса, однако текстовое значение не обновляется, когда фокус запускается снова. После того, как текстовое поле вернет фокус, меню предложений увольняется.
Я не знаю, как мы могли это исправить, но дайте мне знать, если кто-то из вас столкнется с подобной проблемой.
Ответ 7
Я знаю, что это очень старая тема, но у меня точно такая же проблема, и ни одно из представленных выше решений, похоже, не работает... Я предполагаю, что это из-за обновлений в Jquery? Если бы кто-то мог опубликовать рабочий обновленный пример (например, jquery-1.12.4.js//1.12.1/jquery-ui.js), это было бы замечательно.