bootstrap table 简单使用

来源:互联网 发布:淘宝页头图片尺寸 编辑:程序博客网 时间:2024/06/05 21:46

http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/

https://www.cnblogs.com/landeanfen/p/5821192.html#_label2_1

https://www.cnblogs.com/wdcwy/p/6590855.html

<table id="table-javascript"></table>

JS例

<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>

  $("#table-javascript").bootstrapTable({
               method: "get",
               url: "<%=basePath%>fyadmin/sysUser/getUserList",
               cache: false, 
               striped: true,
               pagination: true,
               pageList: [10,50],
               pageSize: 50, 
               showColumns: true,
               showRefresh: true,
               sidePagination: "server", //设置为服务器端分页
               minimumCountColumns: 2,
               clickToSelect: true,
               toolbar: "#custom-toolbar",
               columns: [
{field: "status", checkbox: true}, 
/* {field: "num",title: "序号",align: "center",width: 10,formatter: function(value, row, index) {return index+1;}},  */
{field: "loginname",title: "用户名",align: "left",valign: "middle",sortable: true }, 
{field: "name",title: "姓名",align: "left",valign: "top",sortable: true},
{field: "age",title: "年龄",align: "center",valign: "middle",sortable: true}, 
{field: "identification",title: "身份证",align: "center",valign: "middle",sortable: true}, 
{field: "tel",title: "手机号",align: "left",valign: "middle",sortable: true },
{field: "email",title: "邮箱",align: "left",valign: "middle",sortable: true }, 
{field: "createtime",title: "创建时间",align: "left",valign: "top",sortable: true,  
formatter:function(value,row,index){
if(value!=null){
var date=new Date(value);
return date.Format("yyyy-MM-dd HH:mm:ss");     
}
          }}, 
   ],
        });

原创粉丝点击