На этом шаге мы рассмотрим методы этого виджета.
Материал этого шага базируется на http://www.linkexchanger.su/2011/700.html.
Есть у виджета некоторые методы, с помощью которых можно еще более расширить его функциональность.
Добавим в HTML-разметку пару кнопок:
<button id="search">Искать "as"</button>
<button id="close">Закрыть</button>
<div class="ui-widget">
<label for="tags">Значение: </label>
<input id="tags" type="text" />
</div>
Текст скрипта будет выглядеть так:
$(document).ready(function() {
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: 0
});
$("#search").click(function(){
$("#tags").autocomplete("search", "as");
});
$("#close").click(function(){
$("#tags").autocomplete("close");
});
});
Рис.1. Пример обработки нажатия клавиш
Полный текст этого примера можно взять здесь.Теперь, щелкая по кнопке Искать "as" мы можем имитировать действия пользователя, как если бы он ввел символы "as" в элементе input. Щелкнув по кнопке Закрыть - закрываем список подсказок, если он был открыт ранее.
Ниже приведены описания всех доступных методов:
- destroy - .autocomplete( 'destroy' ) - полностью удаляет всю функциональность виджета Autocomplete. Возвращает элементы в состояние, предшествующее инициализации.
- disable - .autocomplete('disable') - временно запрещает использование всей функциональности виджета. Вновь разрешить ее можно с помощью метода enable.
- enable - .autocomplete('enable') - разрешает использование всей функциональности виджета, если ранее она была запрещена методом disable.
- option - .autocomplete('option', optionName, [value]) - с помощью этого метода можно установить значение любой опции виджета после инициализации.
- option - .autocomplete('option', optionName) - с помощью этого метода можно получить значение любой опции виджета после инициализации.
- widget - .autocomplete('widget') - с помощью этого метода можно получить доступ к объекту, который представляет собой элемент с функциональностью Autocomplete.
- search - .autocomplete('search, [value]') - с помощью этого метода без передачи второго параметра можно открыть весь список. Если передать во втором параметре строку символов, то будет открыт список с подходящими подсказками.
- close - .autocomplete('close') - закрывает список подсказок, если он был открыт ранее.
На следующем шаге мы рассмотрим более сложный пример использования этого виджета.
