Event onButtonClick :: submit

[newuser7000]

I am trying Sencha Architect 2. I designed a window with a single textfield and a button to submit 'username' to test.php
with the


onButtonClick: function(button, e, options) { }
i want to submit to test.php but i don't know how to do this.
-----------------------------------------------------------------------

Ext.define('MyApp.view.MyWindow', {
extend: 'Ext.window.Window',

autoShow: true,
height: 200,
id: 'simple',
width: 346,
defaultType: 'field',
layout: {
type: 'absolute'
},
bodyStyle: 'padding: 5px',
title: 'My Window',

initComponent: function() {
var me = this;

Ext.applyIf(me, {
items: [
{
xtype: 'textfield',
id: 'username',
width: 260,
fieldLabel: 'Label',
x: 10,
y: 10
},
{
xtype: 'button',
text: 'MyButton',
type: 'submit',
x: 10,
y: 80,
listeners: {
click: {
fn: me.onButtonClick,
scope: me
}
}
}
]
});

me.callParent(arguments);
},

onButtonClick: function(button, e, options) {
this.getForm().submit({url: 'test.php'});
}

});

[aconran]

largely it looks good, except your top level component of this is a window, not a form.

Change the top level component to be a form or give it an itemId so that you can easily access tthe form.

[newuser7000]

I would like to post textfield 'username' to test.php, but something is missing, here is the code.
----------------------------------------------------------------------------------------------
MyController
------------------
Ext.define('MyApp.controller.MyController', {
extend: 'Ext.app.Controller',

handler: function(button, e, options) {
this.getForm().submit({url :'http://localhost:3571/project0/test.php'});

},

init: function() {
this.control({
"button": {
click: this.handler
}
});

}

});
----------------------------------------------------------------------------------------------------------------------------

MyForm
------------
Ext.define('MyApp.view.MyForm', {
extend: 'Ext.form.Panel',

height: 110,
id: 'MyForm',
itemId: 'MyForm',
width: 375,
title: 'My Panel',
method: 'POST',
url: 'http://localhost:3571/project0/test.php',

initComponent: function() {
var me = this;

me.initialConfig = Ext.apply({
method: 'POST',
url: 'http://localhost:3571/project0/test.php'
}, me.initialConfig);

Ext.applyIf(me, {
items: [
{
xtype: 'button',
text: 'MyButton',
type: 'submit'
},
{
xtype: 'textfield',
itemId: 'username',
width: 362,
fieldLabel: 'Label'
}
]
});

me.callParent(arguments);
}

});
------------------------------------------------------------------------------------------------------

[newuser7000]

I'm struggling with Architect 2. I just can't figure it out. I have defined in MyController a function to submit a simple form but I can't see the form submits. I discover a way to submit: if you select a button and add an event, now my forms finally submit!!
Thanks.

[oldroy]

Hello,
You've got the control set up for the button, but you have to reference it first or your controller can't find it.

[d.velev]

http://www.youtube.com/watch?v=l0KreSR_9NY

There is a working POST example how to create visual the form and the functions