bootstrapTable的使用

引用

<link href="../../assets/css/bootstrap.min.css" rel="stylesheet">
<script src="../../js/jquery.min.js">script>
<script src="../../assets/js/dataTables.bootstrap.min.js">script>
<link href="../../assets/css/bootstrap-table.css" rel="stylesheet" />
<script type="text/javascript" src="../../assets/js/bootstrap-table.js">script>
<script type="text/javascript" src="../../assets/js/bootstrap-table-zh-CN.js">script>

table组件

<table class="table table-hover table-bordered table-striped text-nowrap"
        id="httpdnsResult" style="height: 100%;">
                <thead>thead>
                <tbody>tbody>
table>

加载bootstrapTable

$('#httpdnsResult').bootstrapTable({
                url : condition,
                method : 'post',
                contentType : "application/x-www-form-urlencoded",
                locale : 'zh-CN',
                pagination : true,
                pageNumber : 1,
                pageSize : 10,
                pageList : [ 10, 20, 50, 100 ],
                sidePagination : "client",
                showRefresh : true,
                search : true,
                strictSearch : false,
                showColumns : true,
                sortable : true,
                sortOrder : 'asc',
                showToggle : true,
                showExport : true, //是否显示导出按钮  
                exportDataType : 'all',
                buttonsAlign : "right", //按钮位置  
                exportTypes : [ 'excel' ], //导出文件类型  
                Icons : 'glyphicon-export',
                exportOptions : {
                    fileName : 'httpdns数据', //文件名称设置  
                    worksheetName : 'sheet1', //表格工作区名称  
                    tableName : 'httpdns数据'
                },
                columns : [ {
                    title : '序号',
                    field : 'num',
                }, {
                    title : 'appName',
                    field : 'appName',
                }, {
                    title : 'netWorkType',
                    field : 'netWorkType',
                }, {
                    title : 'client',
                    field : 'client',
                }, {
                    title : 'time(点击排序)',
                    field : 'time',
                    sortable : true,
                    sortName : 'originalTime'
                }]
            })

表格数据加载成功

$("#httpdnsResult").on('load-success.bs.table',function() {
    //加载成功后操作
}