XML创建可排序、分页的数据显示页面

在Web开发中，我们经常会遇到分页显示和排序数据记录集的情况，这在服务器端使用服务器端的代码和数据库技术是件很轻松的事情，比如：asp、php、jsp等。然而，如果要在客户端显示多条记录并且排序是一件很令人头疼的事情。下面，我们利用Extensible Markup Language（xml，可扩展标记语言）和Extensible Stylesheet Language Transformations（XSLT，可扩展样式单语言转换），并结合XML Path Language（XPath，XML路径语言），只需要编写简单的代码，就可轻松实现。这种方法避免了与服务器频繁打交道的过程，节省了数据显示的时间，浏览者无须等待就可以看到结果，也可以减少服务器的负担。另外。由于XML和XSLT技术，使数据存储和数据显示分离，还可以让我们的代码能够重复利用，大大减轻了程序员编写代码的负担。
下面，我们一步一步地来实现我们的功能。

首先：创建XSLT

XSLT样式单的第一行标明该XML所遵照的XML规范版本，然后是标明该样式单使用的名称空间，这里，我们以XSL规范的正式版本来进行编写，而不采用XSL的草案的写法：

注意：两者在功能和写法上有很大的差异。

接下来，我们定义XSLT里的模板标记：

我们把要显示的样式写到模板里面。我们使用HTML的数据岛来存放我们的数据，这些数据可以利用SQL Server 2000的XML查询来得到，对于不支持XML的数据库，我们可以自己编写组件把数据转换成XML格式，然后在放到数据岛里。在HTML里使用数据岛有两种方法：
一是直接嵌入数据，如下所示：

      <客户关系表>     <客户>每条数据          

二是通过SRC属性引用外部文件，如下所示：

要使用数据岛里的数据，必须通过id名来引用它，当然，由于XSLT文件也是XML格式文件的一种，也可以通过这种方法来实现：

我们在页面中加入标记DIV来显示我们的转换的结果：

使用XSLT转换数据岛里的数据，采用DOMdocument的transNode()方法，并把结果通过DIV的innerHTML属性来展现出来：

DisplayArea.innerHTML = Data.transformNode(Style.documentElement)

第二步：实现客户端排序的功能

我们先设定一个默认的排序字段，这里选择“序号”作为默认的排序关键字，并且是按递增的顺序排列，在XSLT里加入sort标记：

接下来，我们为样式表增加排序的功能，以便可以响应用户的操作，我们在表头的每个列上添加onClick事件，该事件调用sort()函数，允许用户通过单击该表头来进行对该列的排序。

  序号     Sort()函数的语句如下所示：     Function Sort(strField)         Dim sortField     Dim sortOrderAttribute         ''　得到原来排序字段的属性值     Set sortField = Style.XMLdocument.selectSingleNode("//xsl:sort/@select")         ''　得到原来排序的顺序属性值     Set sortOrderAttribute = Style.XMLdocument.selectSingleNode("//xsl:sort/@order")         ''　如果我们已经按所点击的列的字段排序，我们必须改变排序的顺序；     ''　否则，我们只需要按新所点击的列字段按默认的顺序进行排序     If sortField.Value = strField Or sortField.Value = ".*").length     intPages = intTotalRecords / intRecordsPerPage     If InStr(intPages, ".") > 0 Then     intPages = CInt(Left(intPages, InStr(intPages, "."))) + 1     End If         getNumberOfPages = intPages         End Function         '' “下一页”的处理     Function nextPage(intPage)         Dim strDisplay     Dim strDateRange         If CInt(CStr(intPage) * intRecordsPerPage) < Data.selectNodes("/*/*").length Then     intPage = CInt(intPage) + 1     Style.XMLdocument.selectNodes("//@OnClick")(1).Value = "previousPage(" & intPage & ")"     Style.XMLdocument.selectNodes("//@OnClick")(2).Value = "nextPage(" & intPage & ")"     Style.XMLdocument.selectNodes("//xsl:for-each/@select")(1).Value = "./*[position() <= " & (CStr(intPage) * intRecordsPerPage) & " and position() > " & (CInt(intPage) - 1) * intRecordsPerPage & "]"     redisplay (intPage)     End If         End Function         '' 处理“上一页”     Function previousPage(intPage)         Dim strDisplay     Dim strDateRange         If intPage > 1 Then     intPage = CInt(intPage) - 1     Style.XMLdocument.selectNodes("//@OnClick")(1).Value = "previousPage(" & intPage & ")"     Style.XMLdocument.selectNodes("//@OnClick")(2).Value = "nextPage(" & intPage & ")"     Style.XMLdocument.selectNodes("//xsl:for-each/@select")(1).Value = "./*[position() <= " & (CStr(intPage) * intRecordsPerPage) & " and position() > " & (CInt(intPage) - 1) * intRecordsPerPage & "]"     redisplay (intPage)     End If         End Function         '' “第一页”的处理     Function FirstPage()         Style.XMLdocument.selectNodes("//@OnClick")(1).Value = "previousPage(1)"     Style.XMLdocument.selectNodes("//@OnClick")(2).Value = "nextPage(1)"     Style.XMLdocument.selectNodes("//xsl:for-each/@select")(1).Value = "./*[position() < " & intRecordsPerPage + 1 & " and position() > 0]"     transform()     setPageCount()         End Function         '' “最末页”的处理     Function LastPage()         Dim intTotalPages     Dim intTotalRecords         intTotalPages = getNumberOfPages(intTotalRecords)     nextPage (intTotalPages - 1)         End Function                    
客户关系表
          <客户关系表 xmlns:dt="urn:schemas-microsoft-com:datatypes">     <客户><序号 dt:dt="int">01<姓名>Mi<电子邮件>water@21cn.com     <客户><序号 dt:dt="int">02<姓名>uyi<电子邮件>Lily@sina.com     <客户><序号 dt:dt="int">03<姓名>uiyu<电子邮件>John@21cn.com     <客户><序号 dt:dt="int">04<姓名>Doug<电子邮件>Karry@163.net     <客户><序号 dt:dt="int">05<姓名>Ellen<电子邮件>vivki@sina.com     <客户><序号 dt:dt="int">06<姓名>Frank<电子邮件>net_lover@mengxianhui.com.cn     <客户><序号 dt:dt="int">07<姓名>Greg<电子邮件>meng@mengxianhui.com     <客户><序号 dt:dt="int">08<姓名>Harry<电子邮件>sunny@xianhui.net     <客户><序号 dt:dt="int">09<姓名>Ingrid<电子邮件>cathy@hotmail.com     <客户><序号 dt:dt="int">10<姓名>Jeff<电子邮件>your@mxh.com     <客户><序号 dt:dt="int">11<姓名>Kelly<电子邮件>Iloveyou@mengxianhui.com     <客户><序号 dt:dt="int">12<姓名>Larry<电子邮件>smilling@mengxianhui.com     <客户><序号 dt:dt="int">13<姓名>Mark<电子邮件>money@21cn.com     <客户><序号 dt:dt="int">14<姓名>Nancy<电子邮件>www@yahoo.com     <客户><序号 dt:dt="int">15<姓名>Peter<电子邮件>dotnet@aol.com     <客户><序号 dt:dt="int">16<姓名>Rachel<电子邮件>billgates@microsoft.com     <客户><序号 dt:dt="int">17<姓名>Seth<电子邮件>flying@yous.net     <客户><序号 dt:dt="int">18<姓名>Tim<电子邮件>agooyboy@lovegirl.com                    
     
     
     
资料来源：【孟宪会之精彩世界】
     
     
          

把上面的内容拷贝到本地计算机上，分别保存为相应的文件，在IE5+和XML3.0+的环境下即可看到效果！

以上就是XML创建可排序、分页的数据显示页面的内容，更多相关内容请关注PHP中文网（www.kaotop.com）！