PDA

View Full Version : Submitting a form in MVC not working (empty field values)



sir_holmes
9 Mar 2012, 8:51 AM
Hey,I hope you can help me out with some knowledge on forms in ExtJS - I just don't get it working (and I'm pretty new to ExtJS).

In an MVC structure I have a view containing a form 'searchForm' with several fields, the submit button is handled via a controller. Everything works fine so far, except submitting values of the fields to the server. When I hit the submit button, all actions are done but the variables are empty.

I don't get the solution... hope you can help me! Thanks a lot!!


View:


Ext.define('carabids.view.tools.SearchForm', { extend: 'Ext.form.Panel',
alias : 'widget.searchForm',

renderTo: Ext.get('contentBox'),
title: langForm[0],
autoHeight: true,
width: 940,
bodyPadding: 10,
defaults: {
anchor: '100%',
labelWidth: 100
},
items: [
{
xtype: 'textfield',
name: 'searchGenus',
id: 'searchGenus',
fieldLabel: langForm[2],
margin: '5 0 5 0',
submitValue: true
},
....
buttons: [
{
text : langForm[17],
id: 'searchFormExecButton',
action: 'search'
}
....



Controller:

Ext.define('carabids.controller.Tools', {
extend: 'Ext.app.Controller',

stores: [
'DispAbilities',
'Ranges',
'Regions'
],


models: [
'DispAbilities',
'Ranges',
'Regions'
],

views: [
'tools.SearchForm'
],

init: function() {
this.control({
'searchForm button[action=search]': {
click: this.execSearch
}
});
},

execSearch: function(searchFormButton, event) {
console.log('search executed');
console.log(Ext.widget('searchForm').getValues());

Ext.widget('searchForm').getForm().submit({
url: 'serverside/controller.php',
method: 'GET',
params: {
sn: sn,
sid: sid,
action: 'searchDatabase'
},
waitMsg: 'performing search...',
waitTitle: 'Status',
success: function(form, action) {
Ext.Msg.alert('Success', action.result.msg);
},
failure: function(form, action) {
switch (action.failureType) {
case Ext.form.action.Action.CONNECT_FAILURE:
Ext.Msg.alert('Failure', 'AJAX communication failed');
break;
case Ext.form.action.Action.SERVER_INVALID:
Ext.Msg.alert('Failure', action.result.msg);
break;
}
}
});
}
});


Console:
32559

mitchellsimoens
9 Mar 2012, 12:04 PM
When you use Ext.widget you are creating a new instance of the form not using the existing one.In your execSearch you need to resolve the form like this:


var form = searchFormButton.up('formpanel');

Then you should be able to do the getForm() and submit()

sir_holmes
10 Mar 2012, 3:01 AM
Great, it works... changed the code to

execSearch: function(searchFormButton, event) {
console.log('search executed');

searchFormButton.up('searchForm').getForm().submit({
url: 'serverside/controller.php',

...

Thank you for help!