Request for suggestions on select boxes for AXEL

[Stephane]

Hi,

I am currently extending AXEL-FORMS to introduce a widget for selected one or more options along a list of choices, with the possibility to use typeahead to filter options if the list is long.

I have started by extending the 'choice' plugin (which wraps a native HTML <select> list) to support multiple selections, that you can test here :

http://ssire.github.io/axel-forms/editor/editor.xhtml#plugins/Choice

Now the idea is to use AXEL filter architecture to adapt existing selection Javascript libraries so that they can be plugged onto the 'choice' plugin to increase its usability / functionality (since most of them extend the HTML <select> element).

I have started with the 'select2' jQuery based widget, you can see a first result here :
http://ssire.github.io/axel-forms/editor/editor.xhtml#filters/Select2

As you can see it's not much code to create the filter:
https://github.com/ssire/axel-forms/blob/master/src/filters/select2.js

As some first trials gave me the impression that there are some limitations to the 'select2' library (I noticed some webkit issues for dimensioning, some performance limitations with very long lists, etc.), I would like to know if anyone would have a suggestion of any other library that s/he would have already tested and would recommend ?

I see at lest the following requirements :

- single option or multiple options selection
- typeahead to filter options for large data set
- keyboard selection and tab navigation (accessibility)
- multiple selections at once (once the popup opened it should be possible to select/unselect several options)
- placeholder label for empty default selection (serialized to empty string / empty content)
- adjustable drop box height based on available window space
- fast enough with long data set (up to 1000 options)
( - ajax incremental retrieval of options is not a must have for my use cases)

None of the libraries I have tried so far (see below) fully satisfied me on all those criteria...

Thanks in advance for any suggestions,

Stéphane S.
---

PS: here is a list of libraries I have tried so far...

http://ivaynberg.github.io/select2/
http://harvesthq.github.io/chosen/
https://github.com/silviomoreto/bootstrap-select
http://wenzhixin.net.cn/p/multiple-select/