问题描述
应用很简单明了，就是将一个需要修改的员工信息传递到一个页面然后自动把已存在的数据填写到合适的位置，然后供人修改问题：后台数据可以得到，可是无法将数据绑定到指定控件上代码如下：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <title>MyExtFullForm.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <!--<link rel="stylesheet" type="text/css" href="./styles.css">--> <!-- Ext显示必须链接，前后顺序不能颠倒 --> <link rel="stylesheet" href="resources/css/ext-all.css" type="text/css"></link> <script type="text/javascript" src="ext-base.js"></script> <script type="text/javascript" src="ext-all.js"></script> <script type="text/javascript" src="ext-lang-zh_CN.js"></script> <!-- End --> <script> Ext.onReady(function(){ var reader = new Ext.data.JsonReader({ successProperty : 'success', root : 'data' }, [{ name : 'name', type : 'String', mapping : 'name' }, { name : 'address', type : 'String', mapping : 'address' }, { name : 'loves', type : 'int', mapping : 'loves' }, { name : 'memo', type : 'String', mapping : 'memo' }]); var form = new Ext.form.FormPanel({ labelAlign:'right', labelWidth:60, title:'我的表单', frame:true, width:650, url:'form.jsp', items:[{ layout:'column', items:[{ columnWidth:.5, layout:'form', defaultType:'textfield', xtype:'fieldset', title:'姓名', autoHeight:true, items:[{ fieldLabel: '姓名', name:'name', value:reader.get('name') },{ fieldLabel: '地址', name:'address', value:reader.get('address') }] },{ columnWidth:.5, layout:'form', defaultType:'checkbox', xtype:'fieldset', title:'住址', style:'margin-left:20px;', autoHeight:true, items:[{ fieldLabel: '足球', inputValue:'1', name:'loves' },{ fieldLabel: 'DIY', inputValue:'2', name:'loves' },{ fieldLabel: '睡觉', inputValue:'3', name:'loves' },{ xtype:'panel',html:'<center><img src="icon-info.gif"/></center>' }] }] },{ xtype:'fieldset', title:'个人介绍', autoHeight:true, items:[{ width:545, xtype:'textarea', name:'memo', fieldLabel:'个人介绍' }] }], buttons:[{ text:'提交', handler:function(){ form.getForm().submit(); } },{ text:'读取', handler:function(){ form.getForm().load({url:'Ds/Form.txt'}); Ext.MessageBox.alert('Msg',reader) } }] }); form.render("form"); }) </script> </head> <body> <div id="form"></div> </body></html>======================================================================== 我的后台Form.txt内容为{success:true,data:[{ name:'Rooney', address:'Mu', loves:2, memo:'Tank' }]}=======================================================================请大家帮我看看还有两个问题，1.多选框如果取到选中值2.表单提交的时候可不可以先把所有控件的值封装成json格式的数组然后传走呢？Form表单数据自动填充
解决方案
这样写吧this.form.on('render', function() { this.form.load({ url : '***'params : { id : this.recordId} });}, this);在render时去取数据,返回的格式还是一样.1.多选框request.getParameterValues('**');取2.提交表单到后台用request.getParameter('**');去取,如果想用json，只有在前台先取出表单值,再拼成json格式用ajax传到后台,但不好,不如直接提交表单
解决方案二：
你没有必要在外面用reader..然后在form里value:reader.get('address') formpanel里面..是有一个reader的属性的...你可以在formpanel里面写..然后form.load就可以了..片段form里的reader:reader : new Ext.data.JsonReader( {totalProperty : 'totalProperty',root : 'root'},[{name : 'name'},{name : 'id'},{name : 'loginName'},{name : 'passwd'}]),最后form.load下.form.getForm().load({url : '***',params :{id : recordId}});