5

I can export excel but the problem is I can't merge the excel header column. I have attached an image you can check. this is what I want to export like this.

this is what I want to export my excel using javascript

i want to export this table in excel. 

                    <table id="" class="uk-report-table table table-striped">
                        <thead>
                            <tr>
                                <th colspan="1">Date Range</th>
                                <th colspan="5">
                                    <h2>Last 30 Days</h2>
                                </th>
                                <th colspan="5">
                                    <h2>Previous 30 Days</h2>
                                </th>
                            </tr>
                            <tr>
                                <th>A</th>
                                <th>B</th>
                                <th>C</th>
                                <th>D</th>
                                <th>E</th>
                                <th>A2</th>
                                <th>B2</th>
                                <th>C2</th>
                                <th>D2</th>
                                <th>E2</th>
                            </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>

I used this code to export it works fine. I need to merge the first column cells. you can avoid this solution if is there any solution for that.

here is the reference link: How to export Javascript array data to excel on the client side

var lineArray = [];
result_table.forEach(function(infoArray, index) {
  var line = infoArray.join(" \t");
  lineArray.push(index == 0 ? line : line);
});
var csvContent = lineArray.join("\r\n");
var excel_file = document.createElement('a');
excel_file.setAttribute('href', 'data:application/vnd.ms-excel;charset=utf-8,' + encodeURIComponent(csvContent));
excel_file.setAttribute('download', 'Visitor_History.xls');
document.body.appendChild(excel_file);
excel_file.click();
document.body.removeChild(excel_file);
Mustak_Talukder
  • 125
  • 1
  • 8

1 Answers1

6

I'd suggest using a javascript based excel library (e.g. SheetJS) to produce a true excel file. You'll have a lot more options with it than faking it via a csv or html file with a bogus mime-type which is what your sample code is doing.

Here's a fiddle.

<html>
<head>
<script src="//unpkg.com/xlsx/dist/xlsx.full.min.js" type="text/javascript"></script>
<script>
function exportFile(){
  var wb = XLSX.utils.table_to_book(document.getElementById('sampletable'));
  XLSX.writeFile(wb, 'sample.xlsx');
  return false;
}
</script>
</head>
<body>
<table id="sampletable" class="uk-report-table table table-striped">
                        <thead>
                            <tr>
                                <th colspan="1">Date Range</th>
                                <th colspan="5">
                                    <h2>Last 30 Days</h2>
                                </th>
                                <th colspan="5">
                                    <h2>Previous 30 Days</h2>
                                </th>
                            </tr>
                            <tr>
                                <th>A</th>
                                <th>B</th>
                                <th>C</th>
                                <th>D</th>
                                <th>E</th>
                                <th>A2</th>
                                <th>B2</th>
                                <th>C2</th>
                                <th>D2</th>
                                <th>E2</th>
                            </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
<button onclick="return exportFile()">Export</button>
</body>
</html>
clockwatcher
  • 3,193
  • 13
  • 13