XML数据绑定到Table中
2012-03-05 10:59
337 查看
简单的XML数据绑定例子:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-cn"> <title>Binding xml data</title> <head> <script type="text/javascript" language="javascript"> function init() { //初始化页面中的总页数 var totPage = document.getElementById('total'); totPage.innerText = data.recordset.recordcount; } function page(databox,datasrc,moveto) { /* 函数参数: databox为容器的id,即此例中id为oTab的table datasrc为数据源id, 即此例中的data moveto为翻页方式:firstPage(首页)|previousPage(上页)|nextPage(下页)|lastPage(末页) */ var curPage=document.getElementById('current'); switch (moveto) { case 'firstPage': databox.firstPage();datasrc.recordset.movefirst();break; case 'lastPage': databox.lastPage();datasrc.recordset.movelast(); break; case 'previousPage': if (datasrc.recordset.absoluteposition > 1) { databox.previousPage(); datasrc.recordset.moveprevious(); } break; case 'nextPage': if (datasrc.recordset.absoluteposition < datasrc.recordset.recordcount) { databox.nextPage(); datasrc.recordset.movenext(); } break; } curPage.innerText=datasrc.recordset.absoluteposition;//显示当前页数 } </script> </head> <body onload="init();"> <!--内部数据源实例--> <!-- 如内容较多时可单独存放在test.xml文件中,然后用<xml src="test.xml"></xml>导入 --> <!--<xml id="data" src="test.xml""></xml><--> <xml id="data"> <root> <article> <title>第一页</title> <content>1111111111111111</content> </article> <article> <title>第二页</title> <content>2222222222222222</content> </article> <article> <title>第三页</title> <content>3333333333333333</content> </article> <article> <title>第四页</title> <content>4444444444444444</content> </article> <article> <title>第五页</title> <content>55555555555</content> </article> </root> </xml> <table datasrc="#data" dataPageSize="1" id="oTab" border="1"> <tr> <td>title:</td> <td><span datafld="title"/></td> </tr> <tr> <td>content:</td> <td valign="top"><span datafld="content" /></td> </tr> </table> <div> <input type="button" value="首 页" onclick="page(oTab,data,'firstPage');" /> <input type="button" value="上 页" onclick="page(oTab,data,'previousPage');" /> <input type="button" value="下 页" onclick="page(oTab,data,'nextPage');" /> <input type="button" value="末 页" onclick="page(oTab,data,'lastPage');" /> <br/> 第 <span id="current">1</span> 页 | 共 <span id="total"></span> 页 </div> </body> </html>
相关文章推荐
- 数据绑定技术(table,DataSet ,DataView,DataReader ,DropDownList,DataBinder.Eval(),datagrid,dr,)ArrayList,Hashtable绑定到ListBox控件,xml
- DropDownList绑定Xml数据的实现
- Eclipse-插件TableViewer数据绑定
- 利用XML数据绑定实现页面无刷新的数据浏览
- List和XmlListCollection的数据绑定
- jibx进行xml数据绑定的binging.xml配置
- 微信小程序框架wxml(一)wxml数据绑定
- XML文件读取数据绑定到DropDownList
- 在ASP.NET中绑定XML数据
- XML 数据绑定框架 JiBX
- Windows Phone 7的XML操作详解:读取,过滤以及数据绑定
- XML到Java代码的数据绑定之对象
- jQuery EasyUI table表单的数据绑定与交互
- XML 与 Java 技术: 用 Castor 进行数据绑定
- XML 和 Java 技术: 数据绑定的多种用法
- JS读取XML文件数据并以table显示数据(兼容IE火狐)
- 转载--从XML文件中读取数据绑定到DropDownList
- paip.提升效率--数据绑定到table原理和流程Angular js jquery实现
- BootStrap Table 后台数据绑定、特殊列处理、排序功能
- xls 和 xml 数据 排序 绑定 -原创