Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to make HTML table copy-paste-able to Excel

Tags:

html

css

excel

There are some very neat Excel like html spreadsheet options out there such as handsontable, but I am looking for something much simpler:

How can I change the html/css of a regular table, so that it can easily be copy pasted into Excel?

I am not looking for Excel file generator, I merely need my html table to be copy-paste-able.

Handsontable and wijmo flex sheet can do it, my question is: how do I need to enhance a regular html table to be able to do that too?

like image 452
ChristophMa Avatar asked Aug 02 '16 16:08

ChristophMa


1 Answers

you need attention platform compatibillity.

Example for google drive excel: this key word is '\t'

var date = ['2017-01-01', '2017-01-02', '2017-01-03', '2017-01-04'];
var data = ['1', '2', '3', '4'];
var element = window.document.getElementById('table_data');
element.innerHTML = element.innerHTML + '<tr><th>date</th><th>count</th></tr>';
for (var i = 0; i < date.length; i++) {
    element.innerHTML = element.innerHTML + '<tr><td>' + date[i] + '\t' + '</td><td>' + date[i] + '\t' + '</td></tr>';
}
        table {
            font-family: arial, sans-serif;
            border-collapse: collapse;
            width: 100%;
        }

        td, th {
            border: 1px solid #dddddd;
            text-align: center;
            padding: 8px;
        }

        tr:nth-child(even) {
            background-color: #dddddd;
        }
<table id='table_data'>

</table>
like image 168
lingyfh Avatar answered Nov 12 '22 07:11

lingyfh