@@ -21,7 +21,7 @@ jQuery Selectric is a jQuery plugin designed to help at stylizing and manipulati
21
21
Make sure to include jQuery in your page:
22
22
23
23
``` html
24
- <script src =" //ajax.googleapis.com/ajax/libs/jquery/1.11.2 /jquery.min.js" ></script >
24
+ <script src =" https: //ajax.googleapis.com/ajax/libs/jquery/1.12.4 /jquery.min.js" ></script >
25
25
```
26
26
27
27
Include ** jQuery Selectric:**
@@ -40,7 +40,7 @@ Initialize **jQuery Selectric:**
40
40
41
41
``` html
42
42
<script >
43
- $ (function (){
43
+ $ (function () {
44
44
$ (' select' ).selectric ();
45
45
});
46
46
</script >
@@ -167,8 +167,8 @@ $('select').selectric({
167
167
* Description: Customize classes.
168
168
*/
169
169
customClass: {
170
- prefix: ' selectric' ,
171
- camelCase: false
170
+ prefix: ' selectric' , // Type: String. Description: Prefixed string of every class name.
171
+ camelCase: false // Type: Boolean. Description: Switch classes style between camelCase or dash-case.
172
172
},
173
173
174
174
/*
@@ -218,7 +218,17 @@ $('select').selectric({
218
218
* first (or last) once reach the end (or start) item of list upon
219
219
* keyboard arrow navigation.
220
220
*/
221
- allowWrap: true
221
+ allowWrap: true ,
222
+
223
+ /*
224
+ * Type: Object
225
+ * Description: Customize select "multiple" behavior
226
+ */
227
+ multiple: {
228
+ separator: ' , ' , // Type: String. Description: Items separator.
229
+ keepMenuOpen: true , // Type: Boolean. Description: Close after an item is selected.
230
+ maxLabelEntries: false // Type: Boolean or Integer. Description: Max selected items do show.
231
+ }
222
232
}
223
233
```
224
234
@@ -227,7 +237,7 @@ $('select').selectric({
227
237
All events are called on original element, first argument is the original element too. And can be bound like this:
228
238
229
239
``` js
230
- $ (' select' ).on (' eventname' , function (element ){
240
+ $ (' select' ).on (' eventname' , function (element ) {
231
241
// your code
232
242
});
233
243
```
@@ -263,6 +273,22 @@ $('select').on('eventname', function(element){
263
273
<td><code>selectric-close</code></td>
264
274
<td>Fired after select options closes</td>
265
275
</tr >
276
+ <tr >
277
+ <td><code>selectric-before-highlight</code></td>
278
+ <td>Fired before a select option is highlighted</td>
279
+ </tr >
280
+ <tr >
281
+ <td><code>selectric-highlight</code></td>
282
+ <td>Fired when a select option is highlighted</td>
283
+ </tr >
284
+ <tr >
285
+ <td><code>selectric-before-select</code></td>
286
+ <td>Fired before a select option is selected</td>
287
+ </tr >
288
+ <tr >
289
+ <td><code>selectric-select</code></td>
290
+ <td>Fired before a select option is selected</td>
291
+ </tr >
266
292
<tr >
267
293
<td><code>selectric-before-change</code></td>
268
294
<td>Fired before select options change</td>
@@ -279,7 +305,7 @@ $('select').on('eventname', function(element){
279
305
280
306
##Hooks:
281
307
282
- Check [ jquery.selectric.placeholder.js] ( plugins/jquery.selectric.placeholder.js ) source for a usage example
308
+ Check [ jquery.selectric.placeholder.js] ( plugins/jquery.selectric.placeholder.js ) source for a usage example.
283
309
284
310
``` js
285
311
// Add a callback everytime 'callbackName' is called
0 commit comments