当前位置: 首页 > 图文教程 > 网络编程 > Javascript > Ext面向对象开发实践(续)

Javascript
xp风格菜单
具有edit功能的combobox
可以编辑的Select (第二版)
IE6.0打印机制解析
JScript5.5下String.prototype.replace(str,func)的UBB嵌套的递归解开。
vbscript和javascript互相调用方法
转换大写中文数字
Freeonline在线编辑器(自由软件)
对象化JS之----文件上传客户端控制脚本
对象化JS之----日期选择
对象化JS之----仿outlook或者QQ的菜单
如何使用Shell.Application技术
模拟windows control的进度条
双向链表&&堆栈
网页中的媒体播放器
如何在页面显示来访者分辨率,浏览器(js)
子父窗口之间的操作之小例子
JavaScript 实现日历式日期选择
页面上的javascript判断
在客户端用JAVASCRIPT或VBSCRIPT生成WORD文档

Javascript 中的 Ext面向对象开发实践(续)


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 47 ::
收藏到网摘: n/a

我的上一篇文章《Ext面向对象开发实践》中简述了如何编写一个面向对象的数据维护小程序,但这一些都是基于一个客户端数据,即用户一旦刷新页面,所有的操作都将丢失,现在我们就接着上一篇文章来继续讲一下如何对数据表进行增、删、改、查操作。 要实现对数据表中的数据进行操作,第一步就是要取得数据表中的数据,我们把上篇文章中的创建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); //删除客户端数据
},