开发学院网页设计 JavaScript 用 Rico LiveGrid 小部件创建数据集导航阅读

用 Rico LiveGrid 小部件创建数据集导航

　2010-03-09 00:00:00　来源：WEB开发网　　　

核心提示： 装载和更新网格每当装载 HTML 页面时，需要调用 loadGrid 函数，用 Rico LiveGrid 小部件创建数据集导航(6)，清单 6 显示了这是怎么完成的，清单 6. 调用 loadGrid<body>最后，用于处理来自 Rico 的 Ajax 请求，清单 8 显示为了使

装载和更新网格

每当装载 HTML 页面时，需要调用 loadGrid 函数。清单 6 显示了这是怎么完成的。

清单 6. 调用 loadGrid

<body　>　

最后，定义用于更新 Movie LiveGrid 上的 label 的函数，如清单 7 所示。

清单 7. updateLabel 函数

<script>　　　function　updateLabel(　liveGrid,　offset　)　{　　　　　$('showingLabel').innerHTML　=　"Showing　"　+　(offset+1)　+　"　-　"　+　　　　　(offset+liveGrid.metaData.getPageSize())　+　"　of　"　+　　　　　liveGrid.metaData.getTotalRows()　+　"　movies";　　}　 </script>　

每当用户单击滚动条时，就会调用 updateLabel 函数。它主要组合变量和 Rico 库来构造出类似 "Showing 1 - 5 of 20 movies" 的字符串。如果不熟悉 Prototype JavaScript 框架，可以使用 $(DIVNAME) 语法用与 DIVNAME 匹配的 ID 引用页面上的任何对象。因此，$('showingLabel').innerHTML 相当于 document.getElementById("showingLabel").innerHTML。在这个例子中，每当用户单击滚动条时，便用一个更新的字符串替换 DIV 标记的 innerHTML 值。

设置服务器端

Rico 中的大部分代码编写工作是在客户端进行的，但在服务器端也有一些重要的事情要做。也就是说，需要设置服务器端脚本或 servlet 来处理 Ajax 调用。如前所说，我创建了一个例子 servlet，用于处理来自 Rico 的 Ajax 请求。清单 8 显示为了使 LiveGrid 小部件正常运行，应该如何编写来自 servlet 的 XML 响应。

清单 8. XML 响应所需的格式

上一页 1 2 3 4 5 6 7 下一页