轉載

Ext.form.formPanel 與服務器交互 初始化表單

    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()加載。
// 解析后臺返回的數據

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

name:"empNo ",   //表單對應的屬性名

mapping:"empNo"      //為json數據里面 對應的屬性值

}，{name:"empName", mapping:"empName"});

form.getForm().reader = empReader;   //這個不能少，不然明明有獲得數據，確沒有顯示。。

// 從后臺加載json格式數據
form.getForm().load({
url : "employee_selectByPrimaryEmployee.action",     
method : "POST",
params : {
empNo : empNo //參數
}
});

//json數據,即action中 selectByPrimaryEmployee 所要返回到頁面的json數據格式

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

     printwrite.print(json);     //將數據返回到前臺

    這樣子就是通過將服務器數據加載到表單顯示。一定要注意，加載本地和加載遠程不要用錯方法了，加載遠程是用load(),里面傳的url。 本地用 加載用loadRecord()，直接傳入一個Stroe的記錄集，就可以加載進去。

------------------------------------------------------------------------------------------------------------------------------------

grid.on('rowdblclick', function(grid, rowIndex, e) {   

1. if(ds.query('state','new').length!=0){  
2.    console.log("我有新增記錄！");  
3.    //......  
4. } 
   

var editForm = new Ext.form.FormPanel( {
baseCls : 'x-plain',
labelWidth : 75,
url : 'editCustomer.adminService',
defaultType : 'textfield',
items : [new Ext.form.TextField( {
fieldLabel : 'userID',
allowBlank : false,
name : 'id',
anchor : '90%'
}), {
fieldLabel : '用戶名',
name : 'name',
allowBlank : false,// readOnly：true,
anchor : '90%'
}, {
fieldLabel : '真實姓名',
name : 'realName',
allowBlank : false,
anchor : '90%'
}, {
fieldLabel : '國籍',
name : 'unation',
allowBlank : false,
anchor : '90%'
}]
});

var editWin;
var editCustomer = function() {
if (!currRecord) {
Ext.MessageBox.alert('提示', '請選擇一個用戶。');
} else {
if (!editWin) {
editWin = new Ext.Window( {
title : '修改用戶信息',
layout : 'fit',
width : 500,
height : 300,
closeAction : 'hide',
plain : true,
modal : true,
items : editForm,
buttons : [ {
text : '保存',
handler : function() {
// 保存修改信息
if (editForm.form.isValid()) {
editForm.form.submit( {
waitMsg : '正在處理...',
failure : function(form, action) {
Ext.MessageBox.alert(
'Error Message', '保存失敗');
},
success : function(form, action) {
Ext.MessageBox.alert('提示', '保存成功');
addWin.hide();
store.reload();
}
});
} else {
Ext.MessageBox
.alert('錯誤', '請修正頁面提示的錯誤后提交。');
}
}
}, {
text : '關閉',
handler : function() {
editWin.hide();
}
}]
});
}
editWin.show();
editForm.getForm().loadRecord(currRecord);
}
}