hhurz / tableExport.jquery.plugin

jQuery plugin to export a html table to JSON, XML, CSV, TSV, TXT, SQL, Word, Excel, PNG and PDF
MIT License
985 stars 716 forks source link

Can not export hidden columns with bootstrapTable #257

Closed qyq159753 closed 5 years ago

qyq159753 commented 5 years ago

Dear Experts:

Thanks for providing us a such powerful tool, it helps me a lot in my daily work.

Recently, I was facing an issue with the table export plugin and I can't find a solution in the existing posts. I want to export all the data from a bootstrap table including the hidden columns, here is my code pieces:

libs import sequence: 'jquery/jquery-1.10.2.js' 'bootstrap/js/bootstrap-3.3.7.js' 'bootstrap-table-master/dist/bootstrap-table.js' 'bootstrap-table-master/dist/locale/bootstrap-table-zh-CN.js' 'bootstrap-table-master/dist/extensions/export/bootstrap-table-export.min.js' 'libs/FileSaver/FileSaver.min.js' 'libs/js-xlsx/xlsx.core.min.js' 'tableExport.min.js'

html element:

table init: $('#countTable').bootstrapTable({ method: 'POST', dataType: 'json', contentType: "application/x-www-form-urlencoded", cache: false, striped: true, sidePagination: "client", showColumns: true, pagination: true, minimumCountColumns: 2, pageNumber: 1, pageSize: 10, pageList: [10, 25, 50, 100], search: true, strictSearch: true, uniqueId: "rowIndex", showExport: true, exportDataType: 'all', exportTypes: ['excel', 'xlsx'], columns: columnsList, data: dataList }); Some of the fields were hidden by setting the visible:false attribute while preparing the columnsList. The table displays perfectly, and the export button can generate an excel file. But the hidden columns are excluded. Then I find a parameter exportHiddenCells in the documentation. I tried with below code: $('#countTable').tableExport({ type: 'excel', exportHiddenCells: true }); But it still not work as expected. One little thing I noticed, when I was toggling the show/hide switch for a column, the DOM was added/removed in the html rather than show/hided. Could you please point out which step was wrong because I have seeking for the solution for a few days. Thank in advance! Best Regards, William Qiu
hhurz commented 5 years ago

Hi, first of all, I am not an expert on bootstrap tables, so I can only answer questions about the tableExport plugin, which is not specifically designed for bootstrap table. Bootstrap table uses this plugin as an "export engine" for html tables that were produced by bootstrap table.

Some of the fields were hidden by setting the visible:false attribute

visible:false is a bootstrap table property, right? I think this option supresses the output of the data completely and doesn't place it as hidden table cells to the dom. But this is absolutely necessary for the tableExport plugin. It cannot export data that is not present in the DOM. Therefore, you would have to get bootstrap table not to completely suppress the table cells you want to hide, but to output them in the DOM and only hide them. Unfortunately, I don't know how this could be done. If you would add the data attribute data-tableexport-display to these cells, they would be exported then.

the DOM was added/removed in the html rather than show/hided

Thats a specific bootstrap tables issue. So please ask your question there or have a look into their docs, examples and faq's: https://github.com/wenzhixin/bootstrap-table.

Thanks.

qyq159753 commented 5 years ago

Hi hhurz, With your comment finally I got a solution. I selected out and set the attr data-tableexport-display as true, then hided the expected columns in bootstraptable onPostBody function, and removed the columns toggle button to prevent user removing DOM from the table. It's not perfect but working. Thanks a lot for your quick response.

YuhooZhu commented 1 year ago

Hi hhurz, With your comment finally I got a solution. I selected out and set the attr data-tableexport-display as true, then hided the expected columns in bootstraptable onPostBody function, and removed the columns toggle button to prevent user removing DOM from the table. It's not perfect but working. Thanks a lot for your quick response.

thankyou for your answer,I also solved this problem