infoview.jsp 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
  2. <%
  3. String path = request.getContextPath();
  4. String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
  5. %>
  6. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  7. <html>
  8. <head>
  9. <base href="<%=basePath%>">
  10. <title>My JSP 'infoview.jsp' starting page</title>
  11. <meta http-equiv="pragma" content="no-cache">
  12. <meta http-equiv="cache-control" content="no-cache">
  13. <meta http-equiv="expires" content="0">
  14. <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  15. <meta http-equiv="description" content="This is my page">
  16. <meta http-equiv="X-UA-Compatible" content="IE=9"/>
  17. <meta http-equiv="X-UA-Compatible" content="IE=10"/>
  18. <script type="text/javascript" src="js/easyui/XiuCai.index.js"> </script>
  19. <link rel="stylesheet" type="text/css" href="css/easyui/themes/default/easyui.css">
  20. <link rel="stylesheet" type="text/css" href="css/easyui/themes/icon.css">
  21. <link rel="stylesheet" type="text/css" href="css/easyui/demo/demo.css">
  22. <script type="text/javascript" src="css/easyui/jquery.min.js"></script>
  23. <script type="text/javascript" src="css/easyui/jquery.easyui.min.js" charset="utf-8"></script>
  24. <script type="text/javascript" src="css/easyui/locale/easyui-lang-zh_CN.js" charset="utf-8"></script>
  25. <link rel="stylesheet" type="text/css" href="css/common/hzbstyle.css">
  26. <script type="text/javascript">
  27. var i = 1;//第几页
  28. var sum;//总条数
  29. var totalpage;//总页数
  30. $(document).ready(function(){
  31. fLoadTable();
  32. fLoadData(1,10);
  33. });
  34. function fLoadTable(){
  35. $('#tt').datagrid({
  36. fit: true,//自动大小
  37. title: '用户列表',
  38. width: '100%',
  39. height: 580,
  40. toolbar: '#toolbar',
  41. fitColumns: true,
  42. singleSelect:false,
  43. loadMsg:'正在加载, 请稍等 …',
  44. nowrap : true,//设置为true,当数据长度超出列宽时将会自动截取
  45. striped : true,//设置为true将交替显示行背景
  46. collapsible : true,//显示可折叠按钮
  47. singleSelect:true,//为true时只能选择单行
  48. fitColumns:true,//允许表格自动缩放,以适应父容器
  49. rownumbers:true,
  50. frozenColumns:[[ //选择框
  51. {field:'ck',checkbox:true}
  52. ]],
  53. columns:[[
  54. {field:'area',title:'地区',width:'32%'},
  55. {field:'time1',title:'实施系统',width:'32%'},
  56. {field:'time2',title:'封闭试运行',width:'32%'}
  57. ]]
  58. });
  59. }
  60. function fLoadData(page,rows){
  61. document.getElementById("pageNumber").innerText = i;
  62. document.getElementById("from").innerText = (page-1)*rows;
  63. document.getElementById("to").innerText = page*rows;
  64. $.messager.progress({
  65. title: '请等待',
  66. msg: '正在加载数据...',
  67. text: '查询中.......'
  68. });
  69. $.ajax({
  70. type:"POST",
  71. contentType: "application/x-www-form-urlencoded; charset=UTF-8",
  72. url:"ajax/province",
  73. success:function (data){
  74. $.messager.progress('close');
  75. var vData = $.parseJSON(data);
  76. sum = vData.total;
  77. totalpage = Math.ceil(sum/rows);
  78. document.getElementById("total").innerText = sum;
  79. document.getElementById("totalpage").innerText = totalpage;
  80. $('#tt').datagrid('loadData', vData); //将数据绑定到datagrid
  81. $('#pp').pagination({
  82. total:sum,
  83. pageList: [2,10,50,100],
  84. beforePageText: '第',//页数文本框前显示的汉字
  85. afterPageText: '页 共 {pages} 页',
  86. displayMsg: '当前显示 {from} - {to} 条记录 共 {total} 条记录',
  87. onSelectPage:function(pageNumber, pageSize){
  88. fLoadData();
  89. }
  90. });
  91. }
  92. });
  93. }
  94. </script>
  95. </head>
  96. <body>
  97. <!-- 查询结果:数据表格 -->
  98. <table id="tt" cellspacing="0" cellpadding="0" >
  99. </table>
  100. <div id="" style="background:#efefef;width:100%; border:1px solid #ccc;position: absolute;bottom: 0px;float: left;">
  101. <!--<input type="text" id="pageNumber">-->
  102. <div style="float: left;text-align: left;padding-left: 20px;">
  103. <span class="hzbspan">第</span><span id="pageNumber" class="hzbspan"></span><span class="hzbspan">页 共</span><span class="hzbspan" id="totalpage"></span><span class="hzbspan">页 </span>
  104. <select onchange="changeSize();" id="pageSize">
  105. <option value="5">5</option>
  106. <option value="10" selected="selected">10</option>
  107. <option value="20">20</option>
  108. <option value="30">30</option>
  109. </select>
  110. <a id="prepage" class="easyui-linkbutton easyui-tooltip" title="上一页" data-options="iconCls:'icon-undo',plain:true" ></a>
  111. <input type="text" id="selectpage" style="width: 30px;" onchange="selectpage();"/>
  112. <a id="nextpage" class="easyui-linkbutton easyui-tooltip" title="下一页" data-options="iconCls:'icon-redo',plain:true" ></a>
  113. </div>
  114. <div style="float: left;text-align: right;position: absolute;right: 20px;padding-top: 2px" ><span class="hzbspan">当前显示</span><span class="hzbspan" id="from"></span>-<span class="hzbspan" id="to"></span><span class="hzbspan"> 记录 共</span><span class="hzbspan" id ="total"></span><span class="hzbspan">条记录</span></div>
  115. </div>
  116. </body>
  117. </html>