bootstrap table 导出

最新推荐文章于 2025-09-14 06:16:01 发布

原创最新推荐文章于 2025-09-14 06:16:01 发布 · 1.7w 阅读

2 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

当前文章被以下社区和专栏收录：

本文介绍如何通过Bootstrap Table插件实现表格数据的导出功能。主要步骤包括引入必要的JS文件，如tableExport.js和bootstrap-table-export.js，并配置Bootstrap Table以启用导出功能。文章详细展示了配置参数，如showExport、exportDataType等。

1.引入额外js
/tableExport.jquery.plugin/master/tableExport.js

/bootstrap-table/src/extensions/export/bootstrap-table-export.js

2.配置table
$('#tableActivity').bootstrapTable('destroy').bootstrapTable({
            cache: false,
            height: 550,
            showExport: true,//显示导出按钮
            exportDataType: "basic",//导出类型  
            pagination: true,
            pageSize: 50,
            pageList: [10, 25, 50, 100],
            search: true,
            searchAlign:'left',
            showRefresh: true,
            showToggle: true,
            showColumns: true,
            toolbarAlign: 'right',//toolbar位置
            toolbar:"#toolbar",
            buttonsAlign:'left',//刷新按钮位置
            clickToSelect: true,
            idField:'activityRegistrationId',
            responseHandler:'dealData',
            columns:colums,
            data:data
        });
注意：1.bootstrap版本