Hi, I'm working on extjs forms (I use php on server side).
I've finished a working example of form, it submit data to the server, then get JSON result from php.
But I have a problem (I searched very well into forum, but didn't get a solution):
When I call the form.submit method all fields reset to the default values (values I set on creation), bu the POST is made successfully with values inserted by the user.
For example if a textfield starts with value 'a' and the user writes 'b', the POST contains 'b' but just after pressing submit button the field changes to 'a'.
Can someone help me please?
thank you
Lorenzo
Code:
<script type="text/javascript">
/*
* Ext JS Library 1.0
* Copyright(c) 2006-2007, Ext JS, LLC.
* licensing@extjs.com
*
* http://www.extjs.com/license
*/
FormSchema = function(){
var fs;
return{
Init:function(){
Ext.QuickTips.init();
// turn on validation errors beside the field globally
Ext.form.Field.prototype.msgTarget = 'side';
fs = new Ext.form.Form({
labelAlign: 'right',
labelWidth: 75,
method: 'post',
url: '<?php echo $html->url("/products/edit/".$html->tagValue("Product/id")); ?>'
});
fs.fieldset(
{legend:'Completa data for the selected product'},
new Ext.form.TextField({
fieldLabel: 'Name',
name: 'data[Product][name]',
width:190,
value: '<?php echo $html->tagValue("Product/name") ?>'
}),
new Ext.form.TextArea({
fieldLabel: 'Description',
name: 'data[Product][description]',
width:190,
value: '<?php echo str_replace("\n","\\n",$html->tagValue("Product/description")) ?>'
}),
new Ext.form.ComboBox({
fieldLabel: 'Contractor',
hiddenName:'data[Product][contractor_id]',
store: new Ext.data.SimpleStore({
fields: ['id', 'display'],
data : <?php
$completedArray = array();
foreach (array_keys($contractors) as $key) {
$completedArray[$key]=array($key,$contractors[$key]);
}
echo $javascript->object($completedArray);
?>
}),
displayField:'display',
valueField:'id',
typeAhead: true,
mode: 'local',
triggerAction: 'all',
emptyText:'Select...',
selectOnFocus:true,
width:190,
value: '<?php echo $html->tagValue("Product/contractor_id") ?>'
})
);
fs.addButton('Save', function(){
fs.submit({
waitMsg:'Please Wait...',
reset:true,
success:FormSchema.Success,
scope:FormSchema
})
}, fs);
fs.render('edit-form');
},
Success: function(f,a){
if(a && a.result && typeof a.result.level == "number"){
alert(a.result.message);
}
}
}
}();
Ext.onReady(FormSchema.Init, FormSchema, true);
</script>
<script type="text/javascript" src="/css/examples.js"></script>
<link rel="stylesheet" type="text/css" href="/css/examples.css" />
<link rel="stylesheet" type="text/css" href="/css/forms.css" />
<div style="width:340px;">
<div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>
<div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc">
<h3>Edit product</h3>
<div id="edit-form">
</div>
</div></div></div>
<div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>
</div>
If you need I can post in some server all the pages so you can try it.