首页 > java日记 > Ext.form.formPanel 与服务器交互 初始化表单

原创  Ext.form.formPanel 与服务器交互 初始化表单

2010年7月9日 懒猫 发表评论 阅读评论

    formPanel 初始化表单有两种方式加载,一种是本地加载,一种是通过返回回来的Json格式数据加载到表单里面。
得到表单来加载数据的时候,必须用form.getForm(), 得到basicForm()这个对象,formPanel是继承自basciForm()
本地加载通过form.getForm.loadRecord() 加载,传入的一个记录集(new Ext.data.record.create())。 根据相应的映射会自动匹配到表单的每个文本框。
   比如,通过点击表格的编辑事件,得到表格记录的行数据。
var updateGrid = Ext.getCmp(“displayEmpGrid”);
var rows = updateGrid.getSelectionModel().getSelections();
if (rows) {
//for (var i = 0; i < rows.length; i++) {
alert(rows[0].imageUpload);
form.getForm().loadRecord(rows[0]); //将数据集加载到表单中,直接获取表格的数据
Ext.get(‘imageBrowse’).dom.src = “images/anniubg.gif”;
//}
}
   但是将所有的数据放到页面,然后从页面这样子加载,不太推荐,加载所有的数据到页面会加重页面负担。。

   远程加载是通过 form.getForm().load()加载。
// 解析后台返回的数据
form.getForm().reader = empReader;

// 从后台加载json格式数据
form.getForm().load({
url : “employee_selectByPrimaryEmployee.action”,     
method : “POST”,
params : {
empNo : empNo //参数
}
});

var empReader = new Ext.data.JsonReader              //解析Json格式数据。({                                                                                                                                                                                                                                                  

  name:”empNo “,

 mapping:”empNo”      //为json数据里面 对应的属性值 

},{name:”empName”, mapping:”empName”});

//json数据,即action中 selectByPrimaryEmployee 所要返回到页面的json数据格式 

var  json = [{empNo:"111",empName:"小王"}];

    printwrite.print(json);   //将数据返回到前台

   这样子就是通过将服务器数据加载到表单显示。一定要注意,加载本地和加载远程不要用错方法了,加载远程是用load(),里面传的url。 本地用 加载用loadRecord(),直接传入一个记录集,就可以加载进去。

本文来自:北漂一族[http://www.nanbianhz.com]
转载请注明详细出处:http://www.nanbianhz.com/ext-form-formpanel.htm

分类: java日记 标签:
  1. 网页模板
    2010年7月11日15:16 | #1

    博主的博文不错希望有机会多交流

  2. 2010年7月13日10:43 | #2

    谢谢。。。一起相互学习。。

  1. 本文目前尚无任何 trackbacks 和 pingbacks.