submitting error

[gigas01]

I followed this sample code but has an error

Uncaught TypeError: Cannot call method 'getValues' of undefined MyPanel.js:195
Ext.applyIf.items.items.handler MyPanel.js:195
Ext.define.fireHandler ext-all-debug.js:29512
Ext.define.onClick ext-all-debug.js:29502
(anonymous function)
wrap



new Ext.form.Panel({
fullscreen : true,
items : [
{
xtype : 'fieldset',
title : 'Test',
items : [
{
xtype : 'textfield',
label : 'One',
name : 'one'
},
{
xtype : 'textfield',
label : 'Two',
name : 'two'
},
{
xtype : 'textfield',
label : 'Three',
name : 'three'
}
]
},
{
xtype : 'button',
text : 'Save',
ui : 'confirm',
handler : function(button) {
var form = button.up('formpanel'),
values = form.getValues();


Ext.Ajax.request({
url : 'data/form.php',
params : {
data : Ext.encode(values)
}
});
}
}
]
});


and this is my code



{
xtype: 'fieldset',
height: 128,
width: 632,
title: 'Enter New Activity',
url:BASE_URL + 'addActivity',

items: [
{
xtype: 'textfield',
fieldLabel: 'Activity',
anchor: '100%',
name: 'activityName'
},
{
xtype: 'button',
height: 37,
width: 53,
text: 'Save',
//ui: 'confirm',
handler: function(button) {


var form = button.up('form');

var values = form.getValues();



Ext.Ajax.request({
url:BASE_URL + 'addActivity',
params : {
data : Ext.encode(values)
}
});




}
}
],

}

[sword-it]

Hi gigas01,

Problem in The first sample code is getting form reference -



handler : function(button) {
var form = button.up('formpanel'),
values = form.getValues();


instead of formpanel it shpould be form like -

var form = button.up('form'),

and second sample code work fine here.

[gigas01]

Thank you for your answer.

I changed the code to var form = button.up('form') but still not working...:(

both of them :(

This is the full code

[WillBill]

If the above is your full code, you don't seem to have a form in there?

[gigas01]

sorry, I'm a noob dev. I don't know what exactly a 'form' is :(

aren't gridpanel or fieldset these things are forms???

I have to add a

xtype: 'form'

??

[sword-it]

You need to put your form component under form panel like -


{
xtype:'form',
name:'detail',
items:[
{
xtype: 'fieldset',
height: 128,
width: 632,
title: 'Enter New Activity',
url:BASE_URL + 'addActivity',
items: [
{
xtype: 'textfield',
fieldLabel: 'Activity',
anchor: '100%',
name: 'activityName'
},
{
xtype: 'button',
height: 37,
width: 53,
text: 'Save',
//ui: 'confirm',
handler: function(button) {
var form = button.up('form'); var values = form.getValues();
Ext.Ajax.request({
url:BASE_URL + 'addActivity',
params : {
data : Ext.encode(values)
}
}); }
}
],
}
]
}

[gigas01]

Thank you so much!!!

only little problem is the UI became strange :(

but it is not a big deal i can handle it

Thank you!

[WillBill]

sorry, I'm a noob dev. I don't know what exactly a 'form' is :(

aren't gridpanel or fieldset these things are forms???

I have to add a

xtype: 'form'

??

Yes, if you're using this.up('form'). You're telling Ext-Js to look up the dom tree and return the first match it will find (in this case a form). this.down('form') works the same, but does a search in the other direction. Now I am by no means an expert, but as for as I know you can use the xtypes to search for a panel/form. If you want to find a gridpanel you can use this.up('gridpanel') or this.down('gridpanel'), depending on its location.