Кнопка «Поиск» для активации автозаполнения

Question

Я использую плагин jQuery UI Autocomplete.Есть ли способ, которым я могу использовать кнопку «поиск», чтобы активировать запрос вместо того, чтобы делать это в текстовом поле «Автозаполнение»?У моих пользователей очень плохое интернет-соединение, и автозаполнение становится затруднительным для них.

Answer 1

Да, это можно сделать .Чтобы предотвратить естественный поиск, минимальная длина поискового запроса увеличена до (произвольно) 1000 символов.В то же время сам поиск был запущен программно в событии .click () , связанном с кнопкой - это задокументировано на вкладке События на этой странице .MinLength устанавливается в 0 (так что поиск фактически запускается) непосредственно перед началом поиска, и устанавливается равным 1000, когда автозаполнение закрывается.

HTML:

<label for="tags">Tags: </label>
<input id="tags" />
<input type="button" value="Search"/>

JavaScript:

var availableTags = [
    'ActionScript',
    'AppleScript',
    'Asp',
    'BASIC',
    'C',
    'C++',
    'Clojure',
    'COBOL',
    'ColdFusion',
    'Erlang',
    'Fortran',
    'Groovy',
    'Haskell',
    'Java',
    'JavaScript',
    'Lisp',
    'Perl',
    'PHP',
    'Python',
    'Ruby',
    'Scala',
    'Scheme'
    ];

$('#tags').autocomplete({
    source: availableTags,
    minLength: 1000,
    close: function(event, ui) {
        $('#tags').autocomplete('option', 'minLength', 1000);
    }
});

$('input[type="button"]').click(function() {
    $('#tags').autocomplete('option', 'minLength', 0);
    $('#tags').autocomplete('search', $('#tags').val());
});

Answer 2

Идея состоит в том, чтобы отключить автозаполнение, происходящее при добавлении текста. В фокусе мы отключаем автозаполнение и включаем его после нажатия кнопки или нажатия клавиши ввода.

<script type="text/javascript">
$(window).load(function ()
{
    // Creates the autocomplete field
    $("#lookUpField").autocomplete(
    {
        source: ["Luis", "Erick", "Jorge", "Ana", "Anabel"],
        disabled: true
    });

    //disables the search trigger when field selected
    $("#lookUpField").focus(function ()
    {
       $("#lookUpField").autocomplete("disable");
    });


    // disables the field on keypress unless the 'enter' key
    // is pressed in which case it triggers a 'search'
    $('#lookUpField').keypress(function (e)
    {
       if (e.which == 13)
       {
          lookUpData();
       }
       else
       {
           $("#lookUpField").autocomplete("disable");
       }
   });
});

function lookUpData()
{
   $("#lookUpField").autocomplete("enable");
   $("#lookUpField").autocomplete("search");
}
</script>


<div>
    <input id="lookUpField" type="text" />
    <input type="button" value="Go" onclick="lookUpData()" />
</div>