BootStrap轻松实现微信页面开发代码分享(4)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <html> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"https://www.jb51.net/"; %> <head> <meta content="user-scalable=no, width=device-width, initial-scale=1.0" /> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <!-- 新 Bootstrap 核心 CSS 文件 --> <link href="https://cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css"> <!-- 可选的Bootstrap主题文件(一般不用引入) --> <link href="https://cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap-theme.min.css"> <!-- jQuery文件。务必在bootstrap.min.js 之前引入 --> <script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script> <!-- 最新的 Bootstrap 核心 JavaScript 文件 --> <script src="https://cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> <link href="https://www.jb51.net/<%=basePath%>/page/pf/base/bootstrap/table/bootstrap-table.css"/> <script src="https://cdn.bootcss.com/bootstrap-table/1.9.1/bootstrap-table.min.js"></script> <script src="https://cdn.bootcss.com/bootstrap-table/1.9.1/locale/bootstrap-table-zh-CN.min.js"></script> <title>质量/安全列表</title> <script type="text/javascript" src="<%=basePath%>/page/project/wechat/m500point/js/point_quality_security_list.js?version=09092200010"></script> </head> <body> <div> <h4>质量/安全列表</h4> <table data-pagination="false" data-search="false" data-show-refresh="false" data-toggle="card" data-card-view = "true" data-show-toggle="false" data-show-columns="true"> <input type="hidden" value="${pointQualitySecurityDto.pId }"/> <thead> <tr> <th data-field="pointProject" data-halign="center" >工程部位(工点):</th> <th data-field="recordPerson" data-halign="center">记录人:</th> <th data-field="recordDate" data-halign="center">记录时间:</th> <th data-field="checkType" data-halign="center">检查类型:</th> <th data-field="sId" data-visible="false"> <th data-field="qId" data-visible="false"> <th data-field="ck" data-halign="center" data-formatter="showDetail">详细:</th> </tr> </thead> <tbody> </tbody> </table> </div> </body> </html> function initTable() { // 先销毁表格 // $('#cusTable').bootstrapTable('destroy'); // 初始化表格,动态从服务器加载数据 $("#pointQualitySecurityTable").bootstrapTable({ method : "get", // 使用get请求到服务器获取数据 url : "queryQualitySecurityList.do", // 获取数据的Servlet地址 contentType: "application/x-www-form-urlencoded", striped : true, // 表格显示条纹 pagination : false, // 启动分页 pageNumber : 1, // 当前第几页 sidePagination : "server", // 表示服务端请求 // 设置为undefined可以获取pageNumber,pageSize,searchText,sortName,sortOrder // 设置为limit可以获取limit, offset, search, sort, order queryParamsType : "undefined", queryParams : function queryParams(params) { // 设置查询参数 var param = { pageNumber : params.pageNumber, pId:$("#pId").val() }; return param; } }); } function showDetail(value,row,index){ return "<a href='toQualitySecurityViewPage.do?sId="+row.sId+"&qId="+row.qId+"'>查看</a>"; } $(document).ready(function() { // 调用函数,初始化表格 initTable(); // 当点击查询按钮的时候执行 // $("#search").bind("click", initTable); });

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wzdywd.html