PDA

View Full Version : Combo Box Search



Rashikh
22 Aug 2011, 3:12 AM
I am trying to use my combo for Search

I found the example here
http://dev.sencha.com/deploy/ext-3.4.0/examples/form/forum-search.html

This is the example actually what i want , I am trying to execute the same but i was not able to do.

In Firebug I m getting the response with JSON data but the data is not displayed in the Combo,
The drop down of Combo disappears once the search is done.

Here is my code


var ds = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({ url: 'actionServlet?action=search', method: 'GET' }), reader: new Ext.data.JsonReader({ root: 'emp_data', totalProperty: 'totalCount' }), fields: ['emp_id', 'emp_name', 'emp_email_id', 'emp_agency']});var resultTpl = new Ext.XTemplate('<tpl for="."><tpl for="emp_data"><div class="search-item">', '<h3>{emp_id} - {emp_name}</h3>', '<p>{emp_email_id}</p>', '<p>{emp_agency}</p>', '</div></tpl></tpl>');var searchFieldSet = { xtype: 'fieldset', title: 'Search', id: 'searchFieldSet', hideBorders: true, autoHeight: true, hidden: true, defaults: { width: 210 }, items: [{ xtype: 'combo', store: ds, fieldLabel: 'Search', displayField: 'emp_id', typeAhead: false, loadingText: 'Searching...', width: 210, pageSize: 2, hideTrigger: true, tpl: resultTpl, itemSelector: 'div.search-item', onSelect: function(record) { employee_data.setBaseParam('emp_id', record.id); employee_data.load(); Ext.getCmp('emp_id').focus(); } }] };


I have used httpProxy instead of ScriptTag Proxy as in example
i dont know wat i m doing wrong...


Anybody Pls help me wat am i doin wrong here ...

Thanks In Advance !!!!

napiform
22 Aug 2011, 4:21 AM
I'm just putting the code in a more readable form so that other people can answer the question more easily.



var ds = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: 'actionServlet?action=search',
method: 'GET'
}),
reader: new Ext.data.JsonReader({
root: 'emp_data',
totalProperty: 'totalCount'
}),
fields: ['emp_id', 'emp_name', 'emp_email_id', 'emp_agency']
});

var resultTpl = new Ext.XTemplate('<tpl for="."><tpl for="emp_data"><div class="search-item">',
'<h3>{emp_id} - {emp_name}</h3>',
'<p>{emp_email_id}</p>',
'<p>{emp_agency}</p>',
'</div></tpl></tpl>'
);

var searchFieldSet = {
xtype: 'fieldset',
title: 'Search',
id: 'searchFieldSet',
hideBorders: true,
autoHeight: true,
hidden: true,
defaults: {
width: 210
},
items: [{
xtype: 'combo',
store: ds,
fieldLabel: 'Search',
displayField: 'emp_id',
typeAhead: false,
loadingText: 'Searching...',
width: 210,
pageSize: 2,
hideTrigger: true,
tpl: resultTpl,
itemSelector: 'div.search-item',
onSelect: function(record) {
employee_data.setBaseParam('emp_id', record.id);
employee_data.load();
Ext.getCmp('emp_id').focus();
}
}]
};

Rashikh
22 Aug 2011, 5:35 AM
thanks napiform