 |
Главное отличие компонента combobox от компонента select - это возможность редактирования пользователем поля title и "автоподстановка" подходящих пунктов.
Автоподстановка заключается в отображении укороченного набора пунктов выпадающего списка, первые символы которых совпадают с введенными пользователем в поле title. Примеры вы можете посмотреть на любой демо-страничке.
С помощью тулкита SmartSelect можно создавать компоненты трёх типов, по разному работающих с автоподстановкой - атрибут mode определяется тремя возможными значениями: combo, select и text.
Следующие методы создают компоненты трех разных типов:
document.write(FWC.newSmartSelect('[["Red"],["Orange"],["Yellow"],["Green"],["Blue"],["Violet"]]','{"id":"comp1","title":"color...","mode":"combo"}'));
document.write(FWC.newSmartSelect('[["Red"],["Orange"],["Yellow"],["Green"],["Blue"],["Violet"]]','{"id":"comp2","title":"color...","mode":"select"}'));
document.write(FWC.newSmartSelect('[["Red"],["Orange"],["Yellow"],["Green"],["Blue"],["Violet"]]','{"id":"comp3","title":"color...","mode":"text"}'));
Различия налицо.
Вы можете отключить или перенастроить обработчик событий ввода (автоподстановку) с помощью атрибута ontype.
В первом случае достаточно присвоить ему значение ontype="return false;".
Используя этот атрибут можно добиться ещё одного незаменимого эффекта - подстановки пунктов не из списка, а подгрузки их на лету прямо из внешнего источника.
В следущем примере мы создадим компонент SmartSelect mode:text, который при вводе текста будет обращаться к базе данных MySQL, в которой содержится почти 6000 функций языка PHP.
Для этого нам понадобится сделать следующее:
1) приписать атрибуту ontype вызов метода loadOptions_PHP() с необходимыми параметрами,
2) отключить стандартную автоподстановку, добавив в конец return false;, ведь нам нужно дождаться подгрузки пунктов с сервера,
3) в качестве параметра callback передать этой функции значение 'autofill', чтобы та вызвала стандарного обработчика только после окончания подгрузки,
4) с помощью атрибута fillstart задать минимальное количество символов, которые должен ввести пользователь для включения автоподстановки - 2 символа.
А вот и сам пример:
введите первые две буквы..
Как видите, ничего сложного :) Вот вам исходные файлы для ознакомления: xml: файл списка, css: таблица стилей, php: конвертер MySQL -> JSON.
|
 |
