在对ext的form进行布局处理后,发现不能提交textfield的值到服务器上面。代码只能提交params里面的一个参数,其他的field不能提交。下面的代码是布局后的代码:
<html>
<head>
<link rel="stylesheet" type="text/css" href="http://127.0.0.1:8080/greatwall/script/ext/resources/css/ext-all.css"
/>
<script type="text/javascript" src="http://127.0.0.1:8080/greatwall/script/ext/ext-base.js"></script>
<script type="text/javascript" src="http://127.0.0.1:8080/greatwall/script/ext/ext-all.js"></script>
<script type="text/javascript" src="http://127.0.0.1:8080/greatwall/script/ext/ext-lang-zh_CN.js"></script>
<title>Example of
Form Demo</title>
</head>
<script>
function func_submit_click(){
testForm.form.doAction("submit",{
method:'post',
url : 'http://127.0.0.1:8080/greatwall/txn990051.do',
success:function(form,action){
Ext.Msg.alert('add', 'success22222222222');
},
failure:function(form,action){
Ext.Msg.alert('add', 'success2222222222222222222222222');
},
params : { action : 'submit', qq : '233298765' }
});
}
</script>
<body>
<script>
var testForm = null;
Ext.BLANK_IMAGE_URL
= 'http://127.0.0.1:8080/greatwall/script/ext/resources/images/default/s.gif';
var _bodyWidth = Ext.getBody().getWidth()-12;
Ext.onReady(function(){
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget = 'qtip';
testForm = new Ext.FormPanel({name:'testForm',id:'testForm',layout:'table',style:'height:100%',width:_bodyWidth+12,layoutConfig:
{columns:4},defaults:{border:false,layout:'form',frame:false,labelAlign:'right',labelWidth:75,width:_bodyWidth/2,height:30},
method:'post',src:'txn990042.do',title:'testForm',frame:true});
testForm.addButton({text:'submit',name:'button_submit',handler:func_submit_click});
testForm.add({colspan:2,width:_bodyWidth/2.0,items:{xtype:'textfield',fieldLabel:'username',name:'username',anchor:'100%'}});
testForm.add({colspan:2,width:_bodyWidth/2.0,items:{xtype:'textfield',fieldLabel:'email',name:'email',anchor:'100%'}});
testForm.add({colspan:2,width:_bodyWidth/2.0,items:{xtype:'textfield',fieldLabel:'qq',name:'qq',anchor:'100%'}});
testForm.add({colspan:2,width:_bodyWidth/2.0,items:{xtype:'textfield',fieldLabel:'msn',name:'msn',anchor:'100%'}});
testForm.render(Ext.getBody());
});
</script>
</body>
</html>
而使用下面的代码是可以提交到服务器上面的:
<html>
<head>
<link rel="stylesheet" type="text/css" href="http://127.0.0.1:8080/greatwall/script/ext/resources/css/ext-all.css"
/>
<script type="text/javascript" src="http://127.0.0.1:8080/greatwall/script/ext/ext-base.js"></script>
<script type="text/javascript" src="http://127.0.0.1:8080/greatwall/script/ext/ext-all.js"></script>
<script type="text/javascript" src="http://127.0.0.1:8080/greatwall/script/ext/ext-lang-zh_CN.js"></script>
<title>Example of
Form Demo</title>
</head>
<script>
function func_submit(){
testForm.form.doAction("submit",{
method:'post',
url : 'http://127.0.0.1:8080/greatwall/txn990051.do',
success:function(form,action){
Ext.Msg.alert('add', 'success22222222222');
},
failure:function(form,action){
Ext.Msg.alert('add', 'success2222222222222222222222222');
},
params : { action : 'submit', qq : '233298765' }
});
}
</script>
<body>
<script>
var testForm = null;
Ext.BLANK_IMAGE_URL
= 'http://127.0.0.1:8080/greatwall/script/ext/resources/images/default/s.gif';
var _bodyWidth = Ext.getBody().getWidth()-12;
Ext.onReady(function(){
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget = 'qtip';
testForm = new Ext.FormPanel({
name:'testForm',
id:'testForm',
style:'height:100%',
title:'testForm',
frame:true
});
testForm.add({fieldLabel:'username',name:'username',xtype:'textfield'});
testForm.add({fieldLabel:'email',name:'email',xtype:'textfield'});
testForm.add({fieldLabel:'msn',name:'msn',xtype:'textfield'});
testForm.addButton({text:'submit',handler:func_submit});
testForm.render(Ext.getBody());
});
</script>
</body>
</html>
对于表单肯定是需要进行布局处理的,数据提交肯定是可以满足的,但是对于ext来说,怎么样才算是创建了一个html的表单?是FormPanel还是layout为form的?感觉第一段代码是不是添加了多个form在一个大的form里面了,到底ext是怎么处理的,还需要研究研究。