Ext面向對象開發(fā)實踐（續(xù)）

更新時間：2008年11月18日 00:41:32 作者：

我的上一篇文章《Ext面向對象開發(fā)實踐》中簡述了如何編寫一個面向對象的數據維護小程序，但這一些都是基于一個客戶端數據，即用戶一旦刷新頁面，所有的操作都將丟失，現(xiàn)在我們就接著上一篇文章來繼續(xù)講一下如何對數據表進行增、刪、改、查操作。

要實現(xiàn)對數據表中的數據進行操作，第一步就是要取得數據表中的數據，我們把上篇文章中的創(chuàng)建Store的方法也略作調整，讓其從數據表中讀取數據。

復制代碼代碼如下:

this.departmentStore = new Ext.data.JsonStore({ 
proxy: new Ext.data.HttpProxy({url: "http://localhost:8080/Test_EXT/DB/Department.php"}), 
fields: ["department_code", "department_name", "manager", "division_code"] 
}); 

Department.php，負責連接SQL數據庫，取得數據并將其轉換為JSON格式，為Ext的讀取作準備。

復制代碼代碼如下:

<?php 
require('JSON.php'); 
require('uai_Personal_Info.php'); 
$p = new uai_Personal_Info(); 
$result = $p->getDepartmentList(); 
$json = new Services_JSON(); 
echo $json->encode($result); 
還有一點要修改的就是新增和修改窗體的onSubmitClick方法 
onSubmitClick: function() { 
if (this.url != "") { 
this.form.submit({url: this.url, success: this.onSubmit, 
waitTitle: "Save Data", waitMsg: "Transcation process.....", scope: this}); 
this.fireEvent("submit", this, this.form.getValues()); 
} 
}, 

Submit方法需要傳遞一系列參數：
url：數據處理的URL地址，這里傳入的是一個負責處理新增操作的URL
success：如果提交數據處理成功，則會回調這個參數指定的處理代碼
waitTitle：數據提交時彈出對話框的標題
waitMsg：數據提交時彈出對話框的信息內容
scope：回調函數中的this所指對象

這里需要說明的是處理數據的PHP文件中，必須返回一個JSON字串，如果包含"success: true"，則表示處理成或，否則認為處理失敗。例如下面的代碼

復制代碼代碼如下:

<?php 
require('JSON.php'); 
require('uai_Personal_Info.php'); 
$rs = $_POST; 
$rs["success"] = true; //表示處理成功 
$sql = "INSERT INTO uai_department(department_code, department_name, manager, division_code) VALUES('" . 
$_POST["department_code"] . "', '" . $_POST["department_name"] . "', '" . $_POST["manager"] . "', '" . $_POST["division_code"] . "')"; 
$p = new uai_Personal_Info(); 
$rs["r"] = $p->insert_department($sql); 
$json = new Services_JSON(); 
echo $json->encode($rs); 

刪除的處理則與新增、修改略有不同，因為刪除不需要彈出窗體對數據進行操作，所以我們改用Ext.Ajax對象

復制代碼代碼如下:

remove: function() { 
var r = this.getActiveRecord(); 
Ext.Ajax.request({url: "http://localhost:8080/Test_EXT/DB/delete_dept.php", params: {department_code: r.get("department_code")}}); 
this.getStore().remove(r); //刪除客戶端數據 
},