JSFiddle - React, Tailwind, and code Playground
HTML
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jq-3.2.1/jszip-2.5.0/dt-1.10.16/b-1.5.1/b-html5-1.5.1/b-print-1.5.1/datatables.min.css" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/pdfmake.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/vfs_fonts.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/jq-3.2.1/jszip-2.5.0/dt-1.10.16/b-1.5.1/b-html5-1.5.1/b-print-1.5.1/datatables.min.js"></script>
<meta charset=utf-8 />
<title>DataTables - JS Bin</title>
</head>
<body>
<div class="container">
<table id="example" class="table table-bordered display" cellspacing="0" width="100%">
<thead>
<tr>
<th>COL 1</th>
<th>COL 2</th>
<th>COL 3</th>
<th>COL 4</th>
</tr>
</thead>
<tbody>
<tr>
<td><div class="form-group">LINE 1</div><br>LINE 2</td>
<td><p>LINE 3</p><p>LINE 4</p></td>
<td>LINE 5</td>
<td><div class="form-group">LINE 6</div>LINE 7</td>
</tr>
<tr>
<td><div class="form-group">LINE 1</div><br>LINE 2<br>LINE 3<br>LINE 4<br>LINE 5</td>
<td><p>LINE 3</p><p>LINE 4</p></td>
<td>LINE 5</td>
<td><div class="form-group">LINE 6</div>LINE 7</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
JavaScript
function columnToLetter(column)
{
var temp, letter = '';
while (column > 0)
{
temp = (column - 1) % 26;
letter = String.fromCharCode(temp + 65) + letter;
column = (column - temp - 1) / 26;
}
return letter;
}
function remove_tags(html)
{
html = html.replace(/<br>/g,"$br$");
html = html.replace(/(?:\r\n|\r|\n)/g, '$n$');
var tmp = document.createElement("DIV");
tmp.innerHTML = html;
html = tmp.textContent||tmp.innerText;
html = html.replace(/\$br\$/g,"<br>");
html = html.replace(/\$n\$/g,"<br>");
return html;
}
$(document).ready( function () {
var table = $('#example').DataTable({
dom: 'Btirp',
buttons: [
{
extend: 'excelHtml5',
text: 'Excel',
exportOptions: {
format: {
body: function ( data, row, column, node ) {
//need to change double quotes to single
data = data.replace( /"/g, "'" );
// replace p with br
data = data.replace(/<p[^>]*>/g, '').replace(/<\/p>/g, '<br>');
// replace div with br
data = data.replace(/<div[^>]*>/g, '').replace(/<\/div>/g, '<br>');
data = remove_tags(data);
//split at each new line
splitData = data.split('<br>');
//remove empty string
splitData = splitData.filter(function(v){return v!==''});
data = '';
for (i=0; i < splitData.length; i++) {
//add escaped double quotes around each line
data += '\"' + splitData[i] + '\"';
//if its not the last line add CHAR(13)
if (i + 1 < splitData.length) {
data += ', CHAR(10), ';
}
}
...