bsgrid 支持json、xml数据格式
本文使用bsgrid读取json数据
引入文件
bsgrid.all.min.css CSS样式
jquery.min.js jQuery
grid.zh-CN.min.js JS本地化脚本
bsgrid.all.min.js JS脚本
1 2 3 4
| <link rel="stylesheet" href="css/bsgrid.all.min.css" /> <script type="text/javascript" src="js/jquery-1.4.4.min.js"></script> <script type="text/javascript" src="js/grid.zh-CN.min.js"></script> <script type="text/javascript" src="js/bsgrid.all.min.js"></script>
|
实现代码
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20
| <table id="searchTable"> <tr> <th w_index="XH" width="5%;">XH</th> <th w_index="ID" width="5%;">ID</th> <th w_index="CHAR" w_align="left" width="15%;">CHAR</th> <th w_index="TEXT" w_align="left" width="30%;">TEXT</th> <th w_index="NUM" width="5%;">NUM</th> </tr> </table> <script type="text/javascript"> var gridObj; $(function() { gridObj = $.fn.bsgrid.init('searchTable', { url: 'simple.json', //json文件url ajaxType: 'get', //请求方式 pageSizeSelect: true, //是否显示分页大小选择下拉框,默认false pageSize: 10 //分页大小,默认20 }); }); </script>
|
本文参考网站(http://thebestofyouth.com/bsgrid/)