PDA

View Full Version : ComboBox and partial string match.



betoranaldi
13 Jun 2013, 6:48 AM
Please forgive me as I am new here and having trouble wrapping my head around all of this. I know this topic has been posted before but it appears to only apply to older version as when I try to implement the suggestions I get undefined errors.

I am looking to create a simple ComboBox that allows me to list/search products. Using the transform feature of an existing dropdown, I have the following code:


Ext.onReady(function() {
var transformed = Ext.create('Ext.form.field.ComboBox', {
typeAhead: true,
transform: 'productSelector',
autoSelect: false,
width: 764,
listWidth: 714,
minChars: '3',
forceSelection: true,
anyMatch: true,
emptyText: 'Select A Product',
triggerAction: 'all',
editable: true,
autoSelect: false,
listEmptyText: 'No products found',
allowBlank: true,
listeners: {
'blur': function () {
if (this.store.getCount() == 0 || (!this.isExpanded())) {
if (this.getValue() == '' || this.findMatch('text', this.getRawValue()) == false) {
this.setValue('');
this.blur();
}
}
},
'expand': function(self) { self.clearValue(); },
scope:this
}
});
});

This seems to work fairly well I just can't figure out how to get partial string search working.

This seems like the most common solution I have found but I just can't get it to work. Perhaps this is becuase I am using the transform method.


doQuery : function(q, forceAll){ q = Ext.isEmpty(q) ? '' : q;
var qe = {
query: q,
forceAll: forceAll,
combo: this,
cancel:false
};
if(this.fireEvent('beforequery', qe)===false || qe.cancel){
return false;
}
q = qe.query;
forceAll = qe.forceAll;
if(forceAll === true || (q.length >= this.minChars)){
if(this.lastQuery !== q){
this.lastQuery = q;
if(this.mode == 'local'){
this.selectedIndex = -1;
if(forceAll){
this.store.clearFilter();
}else{
this.store.filter(this.displayField, q);
}
this.onLoad();
}else{
this.store.baseParams[this.queryParam] = q;
this.store.load({
params: this.getParams(q)
});
this.expand();
}
}else{
this.selectedIndex = -1;
this.onLoad();
}
}
},

Any suggestions or pointers would greatly be appreciated.

slemmon
16 Jun 2013, 9:57 PM
Can you post an example of the HTML you're using for the transform?