Ext.ux.form.field.BoxSelect - Intuitive Multi-Select ComboBox

[zombeerose]

Can you add requires configs for dynamic loading (Ext.Loader)?

At first glance,

requires: ['Ext.selection.Model','Ext.data.Store']

[zombeerose]

Heads up - BoxSelect is not working with Ext 4.0.5

"me.triggerWrap is null"

[wki01]

Confirmed. It does not work with 4.05.

Also a bug:
If readOnly should not be able to delete values​​.

thanks

[under_dog]

Thanks a ton kleins and kveeiv for a wonderful implementation of Boxselect...

In my project I required Boxselect to contains atleast 50k values from store and it should also give suggestion on user's key press(as it happens in facebook),so I modified kleins's boxselect code as per my requirement.
I am posting my version of boxselect in case anyone has the same requirement as I have...I will also post a new version of boxselect which will be faster than this one in next few days.....
P.S: I am a fresher and working on ExtJs only from last 15 days , I will definitely welcome any suggestion to improve my code...

[kveeiv]

1.1 has been released and the first post has been updated. Please see that post for a more complete list of updates. Many thanks go out to the many testing and coding contributions that have been made so far for this extension.

One more request - can you fire events when adding/removing items to the combo? It would be nice if the record involved was included as a param.

The standard 'change' and 'select' events that are fired by a combobox can be observed. I have modified some of the value tracking so that the change events now pass the values as defined by the valueField, and the select event passes the current values as records. These happen for any change of the field value - rather than ComboBox's behavior of select being fired only on "list selection". I've added an example to the examples page for the event handling and also programmatic value management.

lets say someone is clicking on a boxselect field, typing an email address and doesnt confirm it by enter. Than he move to the second field (by mouse click or TA. Is it possible to make a written value a box after you move to another field?

This has been added as functionality with the createNewOnBlur config option. Please note the interaction of this configuration option with the autoSelect and selectOnTab options of the base ComboBox control.

Also how to add an value to boxselect?

addValue and removeValue have been added for discrete programmatic management of the field value. These functions take the same mixed value representation as setValue, please see the examples page for a complete description of those.

Can you add requires configs for dynamic loading (Ext.Loader)?

At first glance,

requires: ['Ext.selection.Model','Ext.data.Store']

Done. I'm not sure how these interact with the requires definitions of the parent classes, but if it automatically pulls those in then I think this is the extent of those. If you find any others, please let me know.

Heads up - BoxSelect is not working with Ext 4.0.5

Fixed. Ext.form.field.Trigger had modified its field template to track the trigger by id, this change had to be made to the boxselect field template as well. This is still backwards compatible with 4.0.2a for those using the public release.

If readOnly should not be able to delete values​​.

Fixed, also fixed for disabled state.

In my project I required Boxselect to contains atleast 50k values from store and it should also give suggestion on user's key press(as it happens in facebook),so I modified kleins's boxselect code as per my requirement.

One of my use cases is a list of potentially hundreds of thousands of items which also uses the typeAhead configuration to provide the suggestion type of functionality. I see that you were using the other implementation, have you tried this one to accomplish your goals? This one is also faster than the other one when you are dealing with unusually large sets of data/selections, though any contributions towards improving this further are greatly welcomed.

[NatVik]

hi, please help me, i want to set values before box will be render(queryMode: remote). When i use setValue(1), it works but not
stably in firefox(good in explorer). And when i use setValue(1, 2), or setValue('1, 2') or init value: '1, 2' it does not work. My code:
Ext.create('Ext.ux.form.field.BoxSelect', {
id : comboId,
renderTo : renderTo,
multiSelect : true,
displayField : 'name',
valueField : 'id',
//value: '1, 2',
width : 300,
store : new Ext.data.JsonStore({
remoteFilter : true,
model : 'dictionaryModel',
proxy : {
type : 'ajax',
url : url,
method : 'GET',
defaultHeaders : {
'Accept' : 'application/json'
},
reader : new Ext.data.JsonReader({
type : 'json',
root : 'dictionaryRoot'
})
}
}),
minChars : 2,
listeners : {
render : function() {
this.store.load({
params: { query: '' }});
this.setValue('1, 2');
},

[zacware]

This is an excellent plugin. Thanks so much for making it. You should setup a donate paypal link on github for the project.

I noticed 2 issues that may or may not be bugs

#1 When typing in a state in the examples, like "Conn" for conneticut, and then hitting return, Conneticut is entered into the field but then the text "Conn" is still after it. If a match is found and the return key is pressed, the typed text showed go away (?)

#2 I tried using a store with a proxy to get data remotely and I load that using the .load() command on the store when I first create my form that the box select field is in. But if I try to use local query mode when I try to select an item from the list nothing shows up in the field after I click on a selection. If I switch to remote I am sent a query string on the server side which I can use to filter the list but I would prefer to let the store search the store that is already loaded rather than having to go to the server.

[Smalltalker]

There is a strange behavior in the control.

When you select an item, the top of the control moves up

This has happened to someone else?

I attach a video (.zip)

boxselect move up.zip

thanks

Claudio

[yuuzai]

This is is a nice plugin and thanks for developing and maintaining it. I do have a request though. Prolly you could support a dual-trigger wherein the other button selects/deselects all elements.

[raz0r1]

"Bug":
Please Change Line 1066 to

me.fireEvent('autosize', me, newHeight);

so it fits ComboBox events a little more.

thanks.