bootstrapTable 举例


  前提:引入bootstrapTable 插件



函数调用:


  var url =  ---;//后台接口url
    var parameter = {
            'gid': '----'//服务名
        };
    console.log(parameter.gid);
    var table =  $('#myloanTable');
    CreateTable(url,table,parameter );


    
//    表格定义函数
    
  
 function CreateTable(url,table,parameter ){
        table.bootstrapTable({
            url: url,
            method: 'POST', //请求方式(*)
            striped: true, //是否显示行间隔色
            cache: false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
            pagination: true, //是否显示分页(*)
            sidePagination: "server", //分页方式:client客户端分页,server服务端分页(*)
            pageNumber:1, //初始化加载第一页,默认第一页
            pageSize: 10, //每页的记录行数(*)
            strictSearch: true,
            queryParams:function(queryParams){
                queryParams.gid = parameter.gid;
                return JSON.stringify(queryParams);
            },
            responseHandler:function(res){
                //res.total = res.result.loanlists.length;
                console.log(res);
                res = res.result;
                return res;
            },
            showColumns: false,
            pageList:[10],
            
//            表数据
            columns:[{
                field:"",
                checkbox:"true"
            },{
                field:"orderno",
                title:"订单编号"
            },{
                field:"loanno",
                title:"借据编号"
            },{
                field:"loanmoney",
                title:"贷款金额"
            },{
                field:"loanlimit",
                title:"贷款期限"
            },{
                field:"rate",
                title:"利率"
            },{
                field:"repaycycle",
                title:"还款周期"
            },{
                field:"repaytype",
                title:"还款方式"
            },{
                field:"insertdate",
                title:"下单日"
            },{
                field:"startdate",
                title:"开始计息日"
            },{
                field:"enddate",
                title:"最终还款日"
            },{
                title:"操作",
                formatter:function(item,row){
                    return "<a href='myLoanDetail.jsp?loanno="+row.loanno+"' class='btn btn-main btn-xs'>详情</a>"
                }
            }],
//            表数据值
//            data: [{
//                id: 1,
//                name: 'Item 1',
//                price: '$1'
//            }, {
//                id: 2,
//                name: 'Item 2',
//                price: '$2'
//            }]
        });
        
    }







版权声明:本文为sixteen_cicle原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。