JSP中 layui 弹出层中显示table 表格

1、先引入对应的layui.js 、 layui.css

2、body中定义以下DIV 注意要隐藏，不然查询后会将表格再次显示上层界面中

　　</div>

3、注意：先加载table，再去弹出界面，否则第一次查询会不显示数据

　　 var table2;
        function queryInfo(id){
           layui.use(['table'], function() {
               table2 = layui.table;
               var high = 150; //表头高度
               table2.render({
                   elem: '#displayBoxTable',
                   id: 'displayPoolBoxTable',//生成layui table 的标识id，必须提供，用于后文刷新操作，
                   method: 'post', //接口http请求类型，默认：get
                   url:'${ctx}/queryInfo', //?page=1&limit=10（该参数可通过 request 自定义）
                   where:{id:id},
                   page: true, //是否分页
                   limit: 10, //每页显示的条数
                   limits: [10, 20, 30], //每页条数的选择项，默认：[10,20,30,40,50,60,70,80,90]。
                   smartReloadModel:true,
                   cols: [
                       [{
                           title: 'id',
                           field: 'id',
                           align : 'center',
                           valign : 'middle',
                           width:100
                       },{
                           title: '名称',
                           field: 'name',
                           align : 'center',
                           valign : 'middle',
                           width:100
                       },{
                           title: '单价',
                           field: 'price',
                           align : 'center',
                           valign : 'middle',
                           width:100,
                           templet:function(row){
                               return '<span>'+(row.price * 1024.0 / row.flow).toFixed(2)+'元每G</span>';
                            }
                       }]
                   ],
                   done: function(count){
                       $("table").css("width", "100%");//宽度
                       high = high + count * 40;//一条数据的高度是40
                       layer.open({
                           type: 1,
                           title: '详情：',
                           area: ['600px', high+'px'], //宽高
                           content: $('#displayBox')
                       });
                   }
               });
           });
        };