CODEWITHSUNDEEP
extjs
Dhananjay
Dhananjay

Reputation: 211

on press enter perform next button action in EXTJS

I have create the wizard in extjs. in the forms i have 2 fields, I need when user fill the last textfield the press Enter the action should be perform as user cliking on next button. how to achieve it

Upvotes: 1

Views: 10565

Answers (3)

Will
Will

Reputation: 820

The way I achieved this is different to the above, answers, and in my opinion it is superior as you can use the proper MVC model rather than doing it in the view as you have seen.

Within my controller I used the following code in the event definitions (which we do within the init function):

'searchform textfield': {
    specialkey: this.specialKeyPress
},

where 'searhform' is the selector defined in the controller for the form.

Then, the function that handles this looks like the below:

/**
*   Peform the serach when the enter key is pressed.
*/
specialKeyPress(f, e, o) {
    if(e.getKey() == e.ENTER) {
        this.performSearch();
    }
},

The added advantage of this, is that it works on all text fields by default, rather than having to add it manually to each one.

Upvotes: 0

nscrob
nscrob

Reputation: 4483

{
    xtype:'textfield',
    name:'whatever',
    enableKeyEvents: true,
    listeners: {
        keypress : function(textfield,eo){
            if (eo.getCharCode() == Ext.EventObject.ENTER) {
                //enter is pressed call the next buttons handler function here.
                this.up('form').down('nextButton').handler
            }
        }
    }
}

Upvotes: 5

Uygar Y
Uygar Y

Reputation: 2042

Or you can define the function's name directly:

If your button was created like this:

xtype: 'button',
text : 'Go',
listeners: {
    click: {
        fn: me.onSearchClick,
        scope: me
    }
}

You can do this:

{ 
    xtype:'textfield',
    name:'whatever',
    enableKeyEvents: true,
    listeners: {
        keypress : function(textfield,eventObject){
            if (eventObject.getCharCode() == Ext.EventObject.ENTER) {
                me.onSearchClick();
            }
        }
    }
}

Upvotes: 1

Related Questions