构建构建Ajax内存树内存树
火龙果软件工程技术中心
到现在为止,您可能听说过 Ajax(Asynchronous JavaScript and XML 的缩写)。如果您使用过 Google Maps、Yahoo Mail 和
Flickr,便会体会到创建丰富的、交互式 UI 的可能性。
Ajax 本身并不是一项技术,而是通过网页实现的多种技术(HTML、CSS、JavaScript 和 XML)的组合。从本质上而言,Ajax
就是将类似客户端-服务器这样的功能扩展到了 Web。
在本文中,您将学习如何基于任何包含层次数据的表在 Oracle Application Express(以前的 HTML DB)中构建一个基于 Ajax
的内存树。(该内存树的代码基于 Application Express 开发小组成员 Carl Backstrom 提供的示例应用程序。)我之所以在此处
增加了“内存”一词,是因为与 Carl 的示例不同,该树将“记住”在各个页面视图中展开、折叠以及选定的节点。此外,还有一个
搜索功能,用于定位树中的任何节点并相应地将其展开 — 这是一个使用 Application Express 提供的树组件无法实现的功能。
当树使用 Ajax 获取展开的节点时,它可以轻松地伸缩以支持一个具有数千或更多行的表。
要求要求
可以访问 Oracle Application Express 2.0 工作区
可以通过在 http://apex.oracle.com 上请求一个免费工作区或安装 Oracle 数据库 10g 快捷版 (XE)(只限 Windows 和
Linux)来快速访问这样的工作区。请注意,早期版本(1.5 和 1.6)将不起作用。
一个包含层次数据(ID、父 ID、名称)的表
如果没有以这种方式对数据进行了格式化的表,则可以使用 EMP 演示表。
第第 1 步:创建所需的表、序列和触发器步:创建所需的表、序列和触发器
首先,登录到 Application Express 工作区,并创建树所需的数据库对象。TREE_TEMP 表将跟踪针对每个用户展开的树节
点。每当用户单击树中的 + 或 - 图标时,该表将通过 JavaScript 和应用程序级进程自动进行异步填充。
从 SQL Workshop 中:
使用您的 Workspace Name、Username 和 Password 登录(如果使用 Oracle 数据库 XE,则只需使用 Username 和
Password 登录)。
单击 SQL Workshop。
单击 SQL Commands。
将以下代码复制并粘贴到 SQL 区域:
create sequence tree_temp_seq start with 1
然后单击 Run。
将以下代码复制并粘贴到 SQL 区域:
create table tree_temp
( temp_id number,
app_user varchar2(100),
app_session varchar2(100),
pid number,
id number,
name varchar2(100),
exp char(1),
icon varchar2(10)
)
/
然后单击 Run。
将以下代码复制并粘贴到 SQL 区域: