<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="bootstrap/css/bootstrap.css" />
<link rel="stylesheet" href="bootstrap/css/bootstrap-table.css">
</head>
<body>
<table id="table"></table>
<script type="text/javascript" src="bootstrap/js/jquery.min.1.12.4.js"></script>
<script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="bootstrap/js/bootstrap-table.js"></script>
<script type="text/javascript"
src="bootstrap/js/bootstrap-table-zh-CN.js"></script>
<script type="text/javascript">
/* $('#table').bootstrapTable({
method: "post",
url : '/list',
columns : [ {
field : 'userid',
title : 'Item ID'
}, {
field : 'username',
title : 'Item Name'
}, {
field : 'password',
title : 'Item Price'
}, {
field : 'salt',
title : 'Item salt'
}, {
field : 'status',
title : 'Item status'
}]
}); */
var $table;
//初始化bootstrap-table的内容
InitMainTable ();
function InitMainTable () {
//记录页面bootstrap-table全局变量$table,方便应用
//var queryUrl = '/TestUser/FindWithPager?rnd=' + Math.random()
$table = $('#table').bootstrapTable({
url: '/list', //请求后台的URL(*)
method: 'post', //请求方式(*)
toolbar: '#toolbar', //工具按钮用哪个容器
striped: true, //是否显示行间隔色
cache: false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
sortable: true, //是否启用排序
sortOrder: "asc", //排序方式
pagination: true, //是否显示分页(*)
sidePagination: "client", //分页方式:client客户端分页(默认),server服务端分页(*)
pageNumber: 1, //初始化加载第一页,默认第一页,并记录
pageSize: 2, //每页大小
pageList: [2, 3, 4], //可供选择的每页的行数(*)
search: true, //是否显示表格搜索
strictSearch: true,
showColumns: true, //是否显示所有的列(选择显示的列)
showRefresh: true, //是否显示刷新按钮
minimumCountColumns: 2, //最少允许的列数
clickToSelect: true, //是否启用点击选中行
height: 500, //行高,如果没有设置height属性,表格自动根据记录条数觉得表格高度
uniqueId: "userid", //每一行的唯一标识,一般为主键列
showToggle: true, //是否显示详细视图和列表视图的切换按钮
cardView: false, //是否显示详细视图
detailView: false, //得到查询的参数
queryParams : function (params) {
//这里的键的名字和控制器的变量名必须一直,这边改动,控制器也需要改成一样的
var temp = {
rows: params.limit, //页面大小
page: (params.offset / params.limit) + 1, //页码
sort: params.sort, //排序列名
sortOrder: params.order //排位命令(desc,asc)
}
return temp;
},
columns: [{
checkbox: true,
visible: true //是否显示复选框
}, {
field: 'userid',
title: 'ID',
}, {
field: 'username',
title: '姓名',
}, {
field: 'password',
title: '密码',
}, {
field: 'salt',
title: '盐值',
}, {
field: 'status',
title: '加盐'
} ],
onLoadSuccess: function () {
},
onLoadError: function () {
showTips("数据加载失败!");
},
onDblClickRow: function (row, $element) {
var id = row.ID;
EditViewById(id, 'view');
},
});
};
</script>
</body>
</html>