├── bower.json
├── package.json
├── jquery.sumoselect.jquery.json
├── README.md
├── sumoselect.css
├── jquery.sumoselect.min.js
├── select_responsive.html
└── jquery.sumoselect.js
/bower.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "sumoselect",
3 | "main": ["jquery.sumoselect.js", "sumoselect.css"],
4 | "version": "3.0.0",
5 | "homepage": "https://github.com/HemantNegi/jquery.sumoselect",
6 | "authors": [
7 | "HemantNegi",
8 | "B2F",
9 | "ke-an"
10 | ],
11 | "description": "A jQuery plugin that progressively enhances an HTML Select Box into a Single/Multiple option dropdown list",
12 | "keywords": [
13 | "multiselect",
14 | "dropdown"
15 | ],
16 | "dependencies": {
17 | "jquery": ">=1.6"
18 | },
19 | "license": "MIT"
20 | }
21 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "sumoselect",
3 | "version": "2.0.0",
4 | "description": "A jQuery plugin that progressively enhances an HTML Select Box into a Single/Multiple option dropdown list",
5 | "main": "jquery.sumoselect.js",
6 | "scripts": {
7 | "test": "echo \"Error: no test specified\" && exit 1"
8 | },
9 | "repository": {
10 | "type": "git",
11 | "url": "git+https://github.com/HemantNegi/jquery.sumoselect.git"
12 | },
13 | "keywords": [
14 | "multiselect",
15 | "dropdown"
16 | ],
17 | "author": "HemantNegi",
18 | "contributors": [
19 | "HemantNegi",
20 | "B2F",
21 | "ke-an"
22 | ],
23 | "license": "MIT",
24 | "bugs": {
25 | "url": "https://github.com/HemantNegi/jquery.sumoselect/issues"
26 | },
27 | "dependencies": {
28 | "jquery": ">=1.6"
29 | },
30 | "homepage": "https://github.com/HemantNegi/jquery.sumoselect#readme"
31 | }
32 |
--------------------------------------------------------------------------------
/jquery.sumoselect.jquery.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "SumoSelect",
3 | "version": "2.0.0",
4 | "title": "jQuery SumoSelect",
5 | "description": "SumoSelect is a jquery plugin which beautifully renders a single or multiple HTML select element. it can be used for any device e.g for a android device the select will open the default android select popup and vice versa for other devices, and also if it fails to identify the device then it works according to screen resolution which results a select to open in a popup fashion ( like it happens on chrome on android ). its fully customizable and have many other features. ",
6 | "keywords": [
7 | "jquery",
8 | "select",
9 | "multiselect",
10 | "multiple",
11 | "Android",
12 | "IOS",
13 | "Iphone",
14 | "Ipad",
15 | "Windows",
16 | "cross-browser",
17 | "cross-device",
18 | "popup",
19 | "disable",
20 | "selected",
21 | "placeholder"
22 | ],
23 | "homepage": "https://github.com/HemantNegi/jquery.sumoselect",
24 | "author": {
25 | "name": "Hemant Negi",
26 | "url": "https://sqeets.com/"
27 | },
28 | "repository": {
29 | "type": "git",
30 | "url": "https://github.com/HemantNegi/jquery.sumoselect.git"
31 | },
32 | "bugs": "https://github.com/HemantNegi/jquery.sumoselect/issues",
33 | "licenses": [
34 | {
35 | "type": "MIT",
36 | "url": "http://www.opensource.org/licenses/MIT"
37 | }
38 | ],
39 | "dependencies": {
40 | "jquery": ">=1.6"
41 | }
42 | }
43 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | jquery.sumoselect
2 | =============
3 |
4 |
5 | jquery.sumoselect.js - A beautiful cross device Single/Multi Select jQuery Select plugin.
6 | -------------------------------------------------------------------------------
7 |
8 | View Live [Demo Here](http://hemantnegi.github.io/jquery.sumoselect/sumoselect_demo.html)
9 |
10 | Documentaion [Documentation Here](http://hemantnegi.github.io/jquery.sumoselect/)
11 |
12 | Latest stable : [Download from here](https://github.com/HemantNegi/jquery.sumoselect/releases)
13 |
14 |
15 | A jQuery plugin that progressively enhances an HTML Select Box into a Single/Multiple option dropdown list. The dropdown list can be fully customizable using simple css.
16 | It can adapt itself according to any device, keeping in mind that the User Experience is not broken.
17 |
18 |
19 | **Notable Features**
20 | - Inline Search.
21 |
22 | - Optgroup support.
23 |
24 | - Single and Multi select option.
25 |
26 | - Fully customizable by simple css.
27 |
28 | - Supports almost all devices.
29 |
30 | - Intelligently Renders itself according to the devices.
31 |
32 | - Renders native Single/Multiple pop up on Android, ios, Windows and other devices.
33 |
34 | - Custom postback data format (Multiple select data can be passed either as csv or default select)
35 |
36 | - Selected, Disabled, and Placeholder Support
37 |
38 | - Easily extendable to allow developers to create new widgets
39 |
40 | **Update v1.1.0**
41 |
42 | - Wraped all properties in a sumo object connected to native select element.
43 |
44 | - Added standard add, remove, select, unselect, disable, eanble, unload etc. methods for better manipulation
45 |
46 | - Instance of SumoSelect can be accessed from native reference of select element
47 |
48 | - ~~Added ```disabled = true``` to disable/ enable the control.~~ Now its ```enable()``` and ```disable()```
49 |
50 | - Bug fixings..
51 |
52 | **Update v1.2.0**
53 |
54 | - Added a new option for custom dispaly formats
55 |
56 | - Now ```outputAsCSV``` is default set to ```false```
57 |
58 | - fixed problems with unload and other handler methods on mobile deveices
59 |
60 | - Bug fixings..
61 |
62 | **Update v2.0.0**
63 |
64 | - Added tabindex and keyboard navigation support
65 |
66 | - Added select all feature
67 |
68 | - Redesigned the UI (No external icons are used now and color scheme can be controlled by css)
69 |
70 | - Added some really useful new methods like ```reload(), selectAll(), unSelectAll(), enable(), disable()```
71 |
72 | - Better rensponse to lost focus and other events and non recognised devices.
73 |
74 | - Lots of bug Fixings..
75 |
76 |
77 | **Update v3.0.0**
78 |
79 | - Support for searching added.
80 |
81 | - Optgroup support added
82 |
83 | - Restructured markup
84 |
85 | - Direction of select is controllable by settings.
86 |
87 | - All the text can be customized (better localization support).
88 |
89 | - Lots of bug Fixings..
90 |
91 | ##Requirements
92 | jQuery 1.8.3+ (It is always recommended to use the latest version of jQuery)
93 |
94 |
95 | ##Desktop Browser Support
96 | IE8+, Firefox 4+, Chrome, Safari 4+, Opera 11+ (Other browsers may work, but I did not test on them)
97 |
98 |
99 | ##Mobile/Tablet Browser Support
100 | iOs 3+, Android 2.1+ , Windows Mobile (Other browsers may work, but I did not test on them)
101 |
102 |
103 | ##Forking
104 | If you find that you need a feature that SumoSelect does not currently support, either let me know via the SumoSelect issue tracker, or fork SumoSelect on Github and easily extend SumoSelect to create your own widget!
105 |
106 | ##Usage
107 |
108 | *To just go with the default options simply do*
109 |
110 | ```javascript
111 | $(document).ready(function () {
112 | $('.SlectBox').SumoSelect();
113 | });
114 | ```
115 |
116 | *To provide optional settings, simply pass settings object to SumoSelect()*
117 |
118 | ```javascript
119 | $(document).ready(function () {
120 | $('.SlectBox').SumoSelect({placeholder: 'This is a placeholder', csvDispCount: 3 });
121 | });
122 | ```
123 |
124 | If you want a instance to the SumoSelect object to call handler methods
125 |
126 | ```javascript
127 | var MySelect;
128 | $(document).ready(function () {
129 | MySelect = $('.SlectBox').SumoSelect();
130 | });
131 | ```
132 | *NOTE: SumoSelect returns an array of select elements if there are more than one in the matching selector.*
133 |
134 | You can also find the instance to SumoSelect object by directly selecting your select element like
135 | ```javascript
136 | $('select.SlectBox')[0].sumo. .....
137 | ```
138 |
139 | You can perform all the operations on underlying original select and then reload the UI by
140 | ```javascript
141 | $('select.SlectBox')[0].sumo.reload();
142 | ```
143 |
144 | **Settings**
145 |
146 | The following settings are available now:
147 |
148 | - `placeholder` `(string)` The palceholder text to be displayed in the rendered select widget (on priority basis). *Maximum priority is given to native placeholder attribute in select tag i.e. - `` - Then the option with disabled and selected attribute i.e. `