PDA

View Full Version : Multi-select combo box with search



deebugger
12 Jan 2012, 7:56 AM
Hi,

I created two components: a multi-select combo-box extension which also has search and select all/limit/none capabilities, and a search-box component which the combo uses.

Below is a screenshot of the component. The term 'b' is searched in this case, and since only some items are selected, the select all/none button is marked as "some" (kinda like gmail's email selector).

30659

The components can be found here:
- Ext.ux.form.SearchBox: https://github.com/deebugger/Ext.ux.form.SearchBox
- Ext.ux.form.ExtendedComboBox: https://github.com/deebugger/Ext.ux.form.ExtendedComboBox

If you try it, let me know how it went and what's missing / useless / broken.

Cheers!
-DBG

mitchellsimoens
12 Jan 2012, 7:59 AM
Congrats on two more ux

aacoro
19 Feb 2012, 8:47 AM
Hi,

I created two components: a multi-select combo-box extension which also has search and select all/limit/none capabilities, and a search-box component which the combo uses.

Below is a screenshot of the component. The term 'b' is searched in this case, and since only some items are selected, the select all/none button is marked as "some" (kinda like gmail's email selector).

30659

The components can be found here:
- Ext.ux.form.SearchBox: https://github.com/deebugger/Ext.ux.form.SearchBox
- Ext.ux.form.ExtendedComboBox: https://github.com/deebugger/Ext.ux.form.ExtendedComboBox

If you try it, let me know how it went and what's missing / useless / broken.

Cheers!
-DBG

Nice, I think I must try this one out, thanks!

Zeebee
20 Feb 2012, 3:14 AM
The searchfunction in the extendedcombo did not work with me. The default was 'name', changed it to the chosen displayValue.



{
id: 'multiSelectPopupSearch_' + me.id,
hidden: !me.showSearch,
xtype: 'ux-searchbox',
searchFunction: function(value) {

me.store.filter(me.displayField, value, true, false);
me.updateSelectAllIcon(true);
},
clearFunction: function() {
me.store.filter(me.displayField, '');
me.updateSelectAllIcon(true);
}
}

deebugger
20 Feb 2012, 3:26 AM
Changed in github - thanks for noticing!

ldashevskiy
7 May 2012, 3:57 PM
on line 49 in file *.ExtendedComboBox.js

Seems to me that you are also missing in your github archive the images used in your control, such as checked.gif, unchecked.gif, star.png, and star_empty.png -- the first two seem to be part of the standard Ext, but still it would be nice to include their copies nearby the actual css and js files, so that no editing shall be done to the paths in your css file...

Also, the functionality of searching does not work for me fully. Namely, when I delete the searched for text, either by keyboard or by clicking on the X button, I do not get an updated full list of choices :( Is that a bug?

Trying to get it to work at the moment...
If you get this, what config options do I need to set, in order to have multi-select functionality as well as "select all"/"select none" options enabled?

Thanks.

harshp
27 May 2013, 2:00 AM
Hello,

Can you please provide the example to implement this extension.

Thanks in advance.

HarshP

talco
12 Jul 2013, 3:29 AM
some images in the control panel are missing,

good extension, anyway.