PDA

View Full Version : Enter key on form



Stephan123
2 Dec 2009, 3:06 AM
Hello !

I have an form with 2 buttons.
I will submit the form withthe 'login' button and the ENTER key.

Here is my script:


var login = new Ext.Window({
title: 'Login',
id: 'login',
modal: true,
renderTo: Ext.getBody(),
closable: false,
x: 150,
y: 150,
width: 350,
autoHeight: true,
items: [{
xtype: 'form',
id: 'loginformular',
bodyStyle: 'padding: 10px;',
keys: [{
key: [Ext.EventObject.ENTER],
fn: function(){
// Ext.getCmp('ButtonLogin').fireEvent('click');
Ext.ComponentMgr.get('ButtonLogin').fireEvent('click');
// console.warn('Enter');
}
}],
items: [{
xtype: 'textfield',
fieldLabel: SprachUebermittlung('E-Mail Adresse'),
name: 'email',
id: 'email',
width: 200,
vtype: 'email',
msgTarget: 'qtip',
tabIndex: 1,
allowBlank: false
},{
xtype: 'textfield',
fieldLabel: SprachUebermittlung('Passwort'),
name: 'passwort',
id: 'passwort',
inputType: 'password',
width: 200,
msgTarget: 'qtip',
tabIndex: 2,
allowBlank: false,
minLength: 4
}]
}],
buttons: [{
text: 'Login',
tooltip: 'anmelden am System',
cls: 'x-btn-text-icon',
id: 'ButtonLogin',
icon: iconweg_symbole + 'bullet_key.png',
handler: function(){

// here is the submit

} ...
When i press the 'login' button the form where submitted.
When i press the ENTER key it works, but the button 'login' do not 'fire'.

Any idea ?

Your sincerly

Stephan

LutzAlbers
2 Dec 2009, 3:10 AM
If you just want the Enter to submit the form then define a defaultButton on the window config:


...
defaultButton: 'ButtonLogin',
...

Stephan123
2 Dec 2009, 4:58 AM
Hello !

Thanks for the information.
But this is not my way.
In the future of this windoew i need more keys for this.

I need an way to define more keys with 'keys'.

How can help ?

Your sincerly

Stephan

husniadil
2 Dec 2009, 12:15 PM
Ext.getCmp('ButtonLogin').fireEvent('click'); will execute the listeners called click, NOT the handler.



keys: [{
key: [Ext.EventObject.ENTER],
fn: function () {
Ext.getCmp('ButtonLogin').fireEvent('click');
}
}]

---------------------------------------------------

buttons: [{
text: 'Login',
tooltip: 'anmelden am System',
cls: 'x-btn-text-icon',
id: 'ButtonLogin',
icon: iconweg_symbole + 'bullet_key.png',
listeners: {
click: function () {
console.warn('real submit');
}
}
}]