PDA

View Full Version : Combobox search any part of string



watermark
27 Jun 2011, 12:37 PM
Comboboxes can complete a word you're typing, so if you have a combobox of states, typing "wash" will provide "Washington".

When using a local store, is there a way to make it search for any part of the word? So typing "ing" will provide "Washington" as a result?

extjs-world
27 Jun 2011, 8:09 PM
Append the combobox config with
anyMatch: true
This will perform the sub searches for the combobox text.

extjs-world
27 Jun 2011, 8:23 PM
Also you need to override the combobox to allow subsearch


Ext.override (Ext.form.ComboBox, {

anyMatch : false,

//override doQuery function
doQuery : function(q, forceAll){

if(q === undefined || q === null){
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.anyMatch);
}
this.onLoad();
}else{
this.store.baseParams[this.queryParam] = q;
this.store.load({
params: this.getParams(q)
});
this.expand();
}
}else{
this.selectedIndex = -1;
this.onLoad();
}
}
}
})

extjs-world
27 Jun 2011, 9:29 PM
http://extjs-world.blogspot.com/2011/06/case-insensitive-and-subsearch-with.html

watermark
28 Jun 2011, 4:40 AM
That's what I'm looking for, thanks for the links.

King_Aero
27 Sep 2012, 6:35 AM
Here is the complete example from the link seeing how the code was posted as an image (brutal!):


Ext.override (Ext.form.ComboBox, {
anyMatch: true,
caseSensitive: false,

//override doQuery function
doQuery : function(q, forceAll){

if(q === undefined || q === null){
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.anyMatch, this.caseSensitive);
}
this.onLoad();
}else{
this.store.baseParams[this.queryParam] = q;
this.store.load({
params: this.getParams(q)
});
this.expand();
}
}else{
this.selectedIndex = -1;
this.onLoad();
}
}
},
onTypeAhead: function() {
var nodes = this.view.getNodes();
for (var i = 0; i < nodes.length; i++) {
var n = nodes[i];
var d = this.view.getRecord(n).data;
var re = new RegExp('(.*?)(' + '' + Ext.escapeRe(this.getRawValue()) + ')(.*)', this.caseSensitive ? '' : 'i');
var h = d[this.displayField];

h=h.replace(re, '$1<span class="mark-combo-match">$2</span>$3');
n.innerHTML=h;
}
}
});