PDA

View Full Version : Highlight Search Term with combobox



dussab
4 Nov 2009, 9:14 AM
My goal is to highlight the search term in the search results. The issue i'm having is i cannot seem to be able to access the combox to get the search term (need this to apply highlighting) from the Ext.Xtemplate. The sample code below was simplified to use the Xtemplate and attempt to call a function declared outside the XTemplate. The thought was if i could get this working i could always just lookup the search term from the combo and highlight the term in the results.

Any insight on a better approach or feedback on how to get this working would be much appreciated.




// Custom rendering Template


var resultTpl = new Ext.XTemplate(
'<tpl for="."><div class="search-item">',
'{[ test(values.state) ]}',
'</div></tpl>'


);


function test(val){
return val + 1;
}


var search = new Ext.form.ComboBox({
fieldLabel : 'Search by state',
forceSelection : false,
displayField : 'query',
valueField : 'state',
loadingText : 'Querying....',
minChars : 1,
store : ds,
queryDelay: 500,
hideTrigger: true,
pageSize:0,
tpl:resultTpl,
typeAhead:false,
itemSelector : 'div.search-item',
applyTo: 'search'

});



Thanks,
Brian

dussab
4 Nov 2009, 9:27 AM
It seems to work if i do something like this....

// Custom rendering Template

var resultTpl = new Ext.XTemplate(
'<tpl for="."><div class="search-item">',
'{[ this.checkIt(values.state) ]}',
'</div></tpl>',
{ // 5

checkIt : function(v) {
return test(v);
}
}
);

function test(val){
return val + 1;
}