PDA

View Full Version : Submitting a Form in Sencha Touch



vaughanhale
22 Jul 2010, 7:29 PM
Hi Guys,

I get the feeling this will be an easy one, but I have been hitting my head against a wall. I just picked up Sench Touch today and an having issues trying to submit a form. How would you go about it?

I have my code below.



Ext.setup({
icon: 'icon.png',
tabletStartupScreen: 'tablet_startup.png',
phoneStartupScreen: 'phone_startup.png',
glossOnIcon: false,
onReady: function() {

var formBase = {
scroll: 'vertical',

items: [
{
xtype: 'fieldset',
title: 'Who served you today?',
items: [{
xtype: 'select',
name : 'sales_channel',
//label: 'Who served you today?',
options: [
{text: '', value: '0'},
{text: 'Brendan O\'Ceallaigh', value: '24'},
{text: 'Debbie Thom', value: '26'},
{text: 'Erin Devos', value: '25'},
{text: 'Vaughan Hale', value: '23'}
]
}]
}, {
xtype: 'fieldset',
title: 'What did you discuss?',
items: [{
xtype: 'select',
name : 'product',
//label: 'What did you discuss?',
options: [
{text: '', value: '0'},
{text: 'Customer Relationship Management', value: '25'},
{text: 'Marketing Resource Management', value: '26'},
{text: 'Business Intelligence', value: '27'},
{text: 'Digital', value: '28'}
]
}]
}, {
xtype: 'fieldset',
title: 'What dest discribes your business?',
items: [{
xtype: 'select',
name : 'segment',
//label: 'What dest discribes your business?',
options: [
{text: '', value: '0'},
{text: 'Corporate', value: '377'},
{text: 'Government', value: '374'},
{text: 'Small and Medium Enterprises', value: '376'},
{text: 'General Business', value: '375'}
]
}]
},{
xtype: 'fieldset',
title: 'How would you rate the service you received?',
items: [{
xtype: 'slider',
name: 'service_level',
increment: 1,
minValue: 1,
maxValue: 10,
values: [1,2,3,4,5,6,7,8,9,10],
value: 0
}]
},{
xtype: 'fieldset',
title: 'How likely are you to promote us to your friends and / or colleague?',
items: [{
xtype: 'slider',
name: 'nps_rating',
increment: 1,
minValue: 1,
maxValue: 10,
values: [1,2,3,4,5,6,7,8,9,10],
value: 0
}]
}
],

dockedItems: [
{
xtype: 'toolbar',
dock: 'bottom',
items: [
{xtype: 'spacer'},
{
text: 'Reset',
handler: function() {
form.reset();
}
},
{
text: 'Submit',
ui: 'forward',
handler: function() {
console.log(form.getValues());
form.submit();
}
}
]
}
]
};


Ext.apply(formBase, {
url: 'http://demo.microsite.co.nz/ipad/nps/',
autoRender: true,
floating: false,
modal: false,
centered: false,
hideOnMaskTap: true,
fullscreen: true,
layout: {
type: 'auto'
},
//height: 385,
//width: 100
});

var form = new Ext.form.FormPanel(formBase);
form.show();
}
});


I get "TypeError: Result of expression 'form.submit' [undefined] is not a function." When I try submit. I know I have missed something simple, but just can't see it.

evant
22 Jul 2010, 7:38 PM
Form submission will be in the next release.

For now:



Ext.Ajax.request({
url: 'foo',
params: form.getValues()
});

nelis
27 Jul 2010, 5:19 PM
I have this same issue as well. I guess I don't quite understand how the framework actually works. I just want to perform a simple post. The Ajax.request doesn't perform that function does it?

evant
27 Jul 2010, 11:20 PM
It does an Ajax post, but not a standard browser post, no.