jquery.kladr
Version:
227 lines (183 loc) • 16.3 kB
Markdown
jQuery Kladr
================================================================================
Плагин для автодополнения полей адреса при вводе.<br>
В качестве источника данных используется сервис [kladr-api.ru] [1].
Архитектура
--------------------------------------------------------------------------------
* **$.kladr** - ( *статичный объект* ) предоставляет методы и свойства для работы
с сервисом.
* **$('input').kladr** - ( *плагин jQuery* ) плагин для автодополнения адреса.
* **$('input').kladrZip** - ( *плагин jQuery* ) плагин для полей с почтовым индексом.
Свойства объекта $.kladr
--------------------------------------------------------------------------------
* **url** - url сервиса, по умолчанию [http://kladr-api.ru/api.php] [2].
* **type** - перечисление используемых типов объектов. Список значений: *region (область, регион)*,
*district (район)*, *city (населённый пункт)*, *street (улица)*, *building (строение)*.
* **typeCode** - перечисление используемых типов населённых пунктов. Список значений: *city (город)*,
*settlement (посёлок)*, *village (деревня, село)*.
* **validate** *= function (query) {}* - выполняет проверку корректности объекта запроса.
* **api** *= function (query, callback) {}* - непосредственно выполняет запрос к сервису.
В качестве параметров принимает объект запроса и функцию, которой
будет передан ответ сервиса.
* **check** *= function (query, callback) {}* - проверяет существование объекта.
В качестве параметров принимает объект запроса и функцию, которой
будет передан объект (если он существует) либо *false*.
* **setValues** *= function (values, selector) {}* - устанавливает значения для полей, к которым подключён плагин
*$('input').kladr*. В качестве параметра *values* принимает массив объектов КЛАДР или объект вида
*{'тип объекта' => название или id объекта}*. Второй параметр аналогичен параметру функции *getInputs*.
* **setDefault** *= function (param1, param2) {}* - устанавливает значения по умолчанию
для параметров плагина *$('input').kladr*. В качестве параметров принимает аналогично плагину либо объект
со списком изменяемых параметров, либо пару "параметр - новое значение параметра".
* **getDefault** *= function (param) {}* - возвращает значение по умолчанию для параметра плагина *$('input').kladr*.
В качестве параметра принимает название параметра плагина.
* **getInputs** *= function (selector) {}* - возвращает jQuery коллекцию полей ввода, к которым был
подключён плагин *$('input').kladr*. В качестве параметра принимает селектор, DOM элемент или же объект jQuery, в котором
будет выполнен поиск соответствующих полей, по умолчанию *body*.
* **buildAddress** *= function (objs) {}* - строит строку адреса на основании массива объектов КЛАДР.
* **getAddress** *= function (selector, build) {}* - возвращает строку адреса на основании полей ввода,
к которым был подключён плагин *$('input').kladr*. Первый параметр аналогичен параметру функции *getInputs*. В качестве второго
параметра принимает функцию, которой будет собираться строка адреса, по умолчанию *buildAddress*.
Параметры плагина $('input').kladr
--------------------------------------------------------------------------------
* **token** - токен для доступа к сервису, по умолчанию *null*.
* **key** - ключ для доступа к сервису, по умолчанию *null*.
* **type** - тип подставляемых объектов, по умолчанию *null*.
* **typeCode** - тип подставляемых населённых пунктов, по умолчанию *null*.
Может быть использован только если *type == 'city'*.
* **parentType** - тип родительского объекта, по умолчанию *null*.
* **parentId** - идентификатор родительского объекта, по умолчанию *null*.
* **limit** - количество отображаемых в выпадающем списке объектов, по умолчанию *10*.
* **oneString** - включить ввод адреса одной строкой, по умолчанию *false*.
* **withParents** - получить объект вместе с родителями, по умолчанию *false*.
* **parentInput** - селектор, DOM элемент или же объект jQuery, в котором
находится поле ввода родительского объекта, по умолчанию *null*.
* **verify** - проверять введённые данные, по умолчанию *false*.
* **spinner** - отображать ajax-крутилку, по умолчанию *true*.
* **current** - текущий, выбранный объект КЛАДР, *только для чтения*.
* **controller** - контроллер плагина, *только для чтения*.
Методы плагина $('input').kladr
--------------------------------------------------------------------------------
* **source** *= function (query) { return objects; }* - функция для получения
списка объектов отображаемых при автодополнении. В качестве параметра принимает
объекта запроса. По умолчанию запрашивает данные у сервиса [kladr-api.ru] [1].
Может быть переопределена для получения объектов из другого источника.
* **labelFormat** *= function (obj, query) { return label; }* - функция для
форматирования значений в списке. В качестве параметров принимает *obj* – объект
КЛАДР, *query* – объект запроса.
* **valueFormat** *= function (obj, query) { return label; }* – функция для
форматирования подставляемых в поле ввода значений. В качестве параметров
принимает *obj* – объект КЛАДР, *query* – объект запроса.
* **showSpinner** *= function ($spinner) {}* - функция, выводящая ajax-крутилку.
В качестве параметра принимает jQuery объект ajax-крутилки.
* **hideSpinner** *= function ($spinner) {}* - функция, скрывающая ajax-крутилку.
В качестве параметра принимает jQuery объект ajax-крутилки.
События плагина $('input').kladr
--------------------------------------------------------------------------------
Во все события в качестве контекста (this) передаётся текущее поле ввода.
В обработчиках событий **...Before** (*openBefore*, *closeBefore*) объявленных как параметр плагина
( *$('').kladr({openBefore: function () {}})* ) можно отменить действие плагина, если в функции
вернуть **false** ( *$('').kladr({openBefore: function () { return false; }})* ).
* **openBefore** *= function () {}* - возникает перед открытием списка объектов. Доступно как событие
*kladr_open_before* поля ввода.
* **open** *= function () {}* - открыт список объектов. Доступно как событие *kladr_open*
поля ввода.
* **closeBefore** *= function () {}* - возникает перед закрытием списка объектов. Доступно как событие
*kladr_close_before* поля ввода.
* **close** *= function () {}* - закрыт список объектов. Доступно как событие *kladr_close*
поля ввода.
* **sendBefore** *= function (query) {}* - возникает перед отправкой запроса к сервису.
В параметре передаётся объект запроса. Доступно как событие *kladr_send_before* поля ввода.
* **send** *= function () {}* - отправлен запрос к сервису. Доступно как событие *kladr_send*
поля ввода.
* **receive** *= function () {}* - получен ответ от сервиса. Доступно как событие *kladr_receive*
поля ввода.
* **selectBefore** *= function () {}* - возникает перед изменением текущего объекта. Доступно как событие
*kladr_select_before* поля ввода.
* **select** *= function (obj) {}* - выбран объект в списке. В параметре передаётся
текущий, выбранный объект КЛАДР. Доступно как событие *kladr_select* поля ввода.
* **checkBefore** *= function () {}* - возникает перед проверкой введённых пользователем данных.
Вызывается только если параметр *verify* = *true*. Доступно как событие *kladr_check_before* поля ввода.
* **check** *= function (obj) {}* - проверен введённый пользователем объект.
Вызывается только если параметр *verify* = *true*. В параметре передаётся текущий объект КЛАДР.
Доступно как событие *kladr_check* поля ввода.
* **change** *= function (obj) {}* - изменился текущий объект (*current*). В параметре передаётся текущий объект КЛАДР.
Доступно как событие *kladr_change* поля ввода.
Методы контроллера плагина $('input').kladr
-------------------------------------------------------------------------------
* **setValueByName** *= function (name) { return controller; }* - устанавливает значение поля ввода.
В качестве параметра принимает имя объекта.
* **setValueById** *= function (id) { return controller; }* - устанавливает значение поля ввода.
В качестве параметра принимает id объекта.
* **setValueByObject** *= function (obj) { return controller; }* - устанавливает значение поля ввода.
В качестве параметра принимает объект КЛАДР.
* **setValue** *= function (value) { return controller; }* - устанавливает значение поля ввода.
Если в качестве параметра передана строка, значение будет установлено методом *setValueByName*.
Если передано число методом *setValueById*, если объект методом *setValueByObject*.
* **clear** *= function () { return controller; }* - очищает поле ввода.
Пример использования контроллера можно посмотреть в папке [examples] [3].
Плагин $('input').kladrZip
-------------------------------------------------------------------------------
Плагин **$('selector').kladrZip** выполняет проверку введённого пользователем
почтового индекса. В случае если введённый индекс соответствует реальному адресу, плагин
подставляет объекты этого адреса в другие поля формы (см. пример формы для ввода адреса
в папке [examples] [3]).
В качестве параметра принимает селектор, DOM элемент или же объект jQuery, в котором
будет выполнен поиск соответствующих полей адреса, по умолчанию *body*.
Структура папок, файлов
--------------------------------------------------------------------------------
* **jquery.kladr.min.js** - Минимифицированный код плагина
* **jquery.kladr.min.css** - Минимифицированные стили
* **examples** - Примеры
* **images** - Изображения плагина
* **kladr** - Исходный код плагина
Примеры
--------------------------------------------------------------------------------
Автодополнение для ввода адреса одной строкой:
`````javascript
$('input').kladr({
oneString: true
});
`````
Автодополнение городами России:
`````javascript
$('input').kladr({
type: $.kladr.type.city
});
`````
Изменение подписи при выборе района:
`````javascript
$('input').kladr({
type: $.kladr.type.district,
select: function(obj){
$('label').text(obj.type);
}
});
`````
Проверка вводимого пользователем почтового индекса
`````javascript
$('input').kladrZip('form');
`````
Более подробные примеры можно найти в папке [examples] [3].
Загрузка
-------------------------------------------------------------------------------
Загрузить последнюю версию плагина себе в проект можно с помощью Bower:
`````bash
bower install jquery.kladr
`````
Сборка своей версии плагина
-------------------------------------------------------------------------------
Клонируем репозиторий плагина:
`````bash
git clone git://github.com/garakh/kladrapi-jsclient.git
`````
После внесения изменений, выполняем сборку плагина с помощью следующей команды:
`````bash
npm run build
`````
Лицензия
--------------------------------------------------------------------------------
Решение распространяется под лицензией «Общественное достояние» (Public Domain)
и может быть свободно используемо любым лицом без выплат авторских вознаграждений.
[1]: http://kladr-api.ru/ "КЛАДР API"
[2]: https://kladr-api.ru/api.php "API"
[3]: https://github.com/garakh/kladrapi-jsclient/tree/master/examples "Examples"