jQuery Paginated Dropdown
This widget takes a JSON response from the server and converts it into a paginated drop down.
It has features like pagination (pretty obvious), custom templates, JSON filtering, keyboard navigations,
value property selection, state persistence (statefulness) and more.
This Widget has dependencies on jQuery-1.6+, jQuery UI Widget Factory 1.8+ and partially on jQuery filterJSON plugin
(also developed by me).
The filterJSON plugin is a utility which allows you to filter a JSON response
based on property alone. Using filterJSON would be really helpful in scenarios where we are simply
returning a static JSON response always and are not doing any server-side filtering of the objects.
You can explore filterJSON over here.
However, using filterJSON plugin is not mandatory and can be completely ignored.
| Demo |
|---|
|
# Use below table to change configuration of Paginated Dropdown widget applied to input box.
|
| Properties | Values |
|---|---|
| url*: | Default: null (Current value returns json object with id, name and email property) |
| itemTemplate*: | Default: null |
| valueProperty*: | Default: null (one of the properties in the returned json object.) |
| itemsPerPage: | Default: 10 |
| dropdownWidth: | Enter numeric value. Default: null |
| persistState: | Default: false |
| closeBtnRequired: | Default: true |
| footerRequired: | Default: true |
| keyNavigation.up-down: | Default: true |
| keyNavigation.next-prev: | Default: true |
| customEventPrefix: | Default: 'paginateddropdown' |
| filterJSON: | Default: null |
| cache: | Default: false |
Browser Support
IE7+, FF 3.6+, Opera 12+, Safari 5+ and Chrome.
Known Issues
If you are using filterJSON plugin. Then for this widget to work in IE7 and below, you will have to include JSON2.
You can use: http://ajax.cdnjs.com/ajax/libs/json2/20110223/json2.js
Licence
Copyright (c) 2012 Kapil Kashyap. Dual licensed under MIT License and GPL License.