Ext.ux.form.SuperBoxSelect as seen on facebook and hotmail

[icarey]

I am using extjs version 3.3.1 I would like to use the resizable property but it does not work. I want to have resizable: true. For this to work I have to change in SuperBoxSelect.js resizable : false to resizable : true , it seems this property is ignored when the combobox xtype is superboxselect

code in SuperBoxSelect.js
initComponent:function() {
Ext.apply(this, {
items : new Ext.util.MixedCollection(false),
usedRecords : new Ext.util.MixedCollection(false),
addedRecords : [],
remoteLookup : [],
hideTrigger : true,
grow : false,
resizable : true,
multiSelectMode : false,
preRenderValue : null
});

My code:
{
columnWidth:.28,
layout: 'form',
items:
[
{
xtype:'superboxselect',
fieldLabel: 'Auth',
name: 'drugauth',
mode: 'local',
typeAhead: true,
forceSelection: true,
editable: false,
triggerAction : 'all',
store: drugauthstore,
displayField:'DrugAuthority',
valueField: 'DrugAuthorityID',
hiddenName: 'drugauthID[]',
resizable: true,
navigateItemsWithTab: false,
removeValuesFromStore: false,
preventDuplicates: false,
stackItems: true,
//allowBlank:false,
anchor: '100%'
}
]
}

Thanks,
Ivan

[pret]

I managed to solve (I think) the z-index problem in my case. I just added a listClass property to the component (it's inherited from ComboBox), being the definition of the css class:

mySuperComboListClass
{
    z-index: 9999!important;
}

Obviusly it isn't the best solution, but it worked for me.

Hope it helps.


Thanks a lot for this amazing extension!

[OpnSrce]

Has anyone figured out how to add /enable support for using Shift + Click to select groups of multiple items?

[muncher]

how do I get the selected items corresponding records ? seems like the selected items are removed from the combobox store !

[timbonicus]

how do I get the selected items corresponding records ? seems like the selected items are removed from the combobox store !

The behavior can be controlled with the removeValuesFromStore configuration option. Access the selected items with <SuperComboBox variable>.items (or this.items in a subclass).

[frrogoy]

Does this still work? I'm using Extjs3.2.
I get an error when hovering on this statement:
var rec = sbs1.findSelectedRecord(tip.triggerElement);
Errors with sbs1.findSelectedRecord is not a function.

[icarey]

It seems there is no Select event like there is in a standard Combobox.
I want to use the selected record data when it is selected in the list. This works fine with the standard Combobox.
Is there an event that fires when I click on an item in the list and if not can superboxselect be extended to have one?

I added this line of code from Extjs Combo.js under the onSelect
this.fireEvent('select', this, record, index);

And added it to the onSelect of SuperBoxSelect.js

onSelect : function(record, index) {
if (this.fireEvent('beforeselect', this, record, index) !== false){
var val = record.data[this.valueField];

if(this.preventDuplicates && this.hasValue(val)){
return;
}

this.setRawValue('');
this.lastSelectionText = '';

if(this.fireEvent('beforeadditem',this,val) !== false){
this.addRecord(record);

//next line added, it is taken from the standard combobox code
this.fireEvent('select', this, record, index);

}
if(this.store.getCount() === 0 || !this.multiSelectMode){
this.collapse();
}else{
this.restrictHeight();
}
}
},

I don't know if this is the right way to do it, but the Select event now fires.
Thanks,
Ivan

[rajshinny]

how can i have country flags in front of country names ,in superboxselect control pls help me in this

[extjs-dev]

I am getting this.el is undefined error on line 681 of SuperBoxSelect.js

I defined a variable superCombo and assign the super combo object to this variable. I then use the superCombo variable as an item in a fieldset.

 
var superCombo = {

xtype: 'superboxselect',
id: 'suppliercombo',
name: 'supplier',
hiddenName: 'supplier.id',
allowBlank: true,
msgTarget: 'under',
fieldLabel: 'Supplier',
emptyText: 'Select supplier',
resizable: true,
anchor: '100%',
store: supplierStore,
mode: 'local',
displayField: 'name',
valueField: 'id',
extraItemCls: 'x-tag'
};

Anyone run into a similar problem or know what I am doing wrong.

[icarey]

I am getting this.el is undefined error on line 681 of SuperBoxSelect.js

I defined a variable superCombo and assign the super combo object to this variable. I then use the superCombo variable as an item in a fieldset.

 
var superCombo = {

xtype: 'superboxselect',
id: 'suppliercombo',
name: 'supplier',
hiddenName: 'supplier.id',
allowBlank: true,
msgTarget: 'under',
fieldLabel: 'Supplier',
emptyText: 'Select supplier',
resizable: true,
anchor: '100%',
store: supplierStore,
mode: 'local',
displayField: 'name',
valueField: 'id',
extraItemCls: 'x-tag'
};

Anyone run into a similar problem or know what I am doing wrong.

I am not sure exactly but line 681 refers to the hiddenName and I see your hiddenName is 'supplier.id', I think the problem may be the period . try to change your Store name to supplierID and then make hiddenName 'supplierID'. that is try it with no period.