View Full Version : Adding handler to capture Return in search field

18 Jul 2010, 12:26 AM

The twitter example uses a search field in the toolbar but the button next to it gets the search field value and processes the action.

Is it possible to add a handler/event to the search field which fires when the user presses enter in the search field itself - rather than having to use the button 'click' event?


18 Jul 2010, 4:18 PM
Have a look at the code in the example (SearchBar), you'll see it catches the form submit event to add the button under the search field.

19 Jul 2010, 2:44 AM

Thanks - wrapping the search field in a form panel and capturing the submit event worked well. Code used was:

var searchField = new Ext.form.SearchField({
placeholder: 'Year',
style: 'width: 80px;',
centered: true,
cls: 'usearch',

// wrap the search field in a formpanel so we can capture the submit event
var searchForm = new Ext.form.FormPanel({
baseCls: 'x-form-nostyle',
items: searchField,
listeners: {
submit: function() {
// on submit (enter) then display year
var value = searchField.getValue();
if (value.length > 0) {
params: {
parm: value
}); // read call
timeline.scroller.scrollTo({x: 0, y: 0}, true); // scroll to the top
} // if
} // submit
} // listener