Format hyperlinks when exporting HTML table to Excel
I am loading the content of an HTML table to Excel using JavaScript as instructed in Export HTML table to Excel, loading its content to Excel .
My table has links in one column. When I load, the contents of this column are displayed as hyperlinks in the Excel sheet. I want to export my spreadsheet to Excel without these links (just text).
Is there a way to do this?
+3
source to share
1 answer
You must replace all hyperlinks with text.
Clone the table to be exported
table = $('#'+tableName).clone();
Replace the anchor tag with the appropriate range
var sp1 = document.createElement("span");
var sp1_content = document.createTextNode($(hyperLinks[i]).text());
sp1.appendChild(sp1_content);
var sp2 = hyperLinks[i];
var parentDiv = sp2.parentNode;
parentDiv.replaceChild(sp1, sp2);
You can find here details about the replacement of a node.
Exported using a stop request response
Here is a snippet or PEN
var tmp;
function strip(html) {
tmp = document.createElement("DIV");
tmp.innerHTML = html;
console.log(tmp.innerText);
console.log(tmp.textContent);
return tmp.textContent || tmp.innerText || "";
}
var tableToExcel = (function() {
var uri = 'data:application/vnd.ms-excel;base64,',
template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>',
base64 = function(s) {
return window.btoa(unescape(encodeURIComponent(s)))
},
format = function(s, c) {
return s.replace(/{(\w+)}/g, function(m, p) {
return c[p];
})
}
return function(table, name, filename) {
if (!table.nodeType)
/*Clone the table that is to be exported*/
table = $('#'+table).clone();
var hyperLinks = table.find('a');
for (i = 0; i < hyperLinks.length; i++) {
//hyperLinks[i] = $(hyperLinks[i]).text();
var sp1 = document.createElement("span");
// give it an id attribute called 'newSpan'
sp1.setAttribute("id", "newSpan");
// create some content for the new element.
var sp1_content = document.createTextNode($(hyperLinks[i]).text());
console.log(sp1_content);
// apply that content to the new element
sp1.appendChild(sp1_content);
// build a reference to the existing node to be replaced
var sp2 = hyperLinks[i];
var parentDiv = sp2.parentNode;
// replace existing node sp2 with the new span element sp1
parentDiv.replaceChild(sp1, sp2);
}
var ctx = {
worksheet: name || 'Worksheet',
table: table[0].innerHTML
}
document.getElementById("dlink").href = uri + base64(format(template, ctx));
document.getElementById("dlink").download = filename;
document.getElementById("dlink").click();
}
})()
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a id="dlink" style="display:none;"></a>
<table name="tablename" id="tablename" border="1">
<tr>
<td>1</td>
<td><a href="http://google.com">google</a></td>
</tr><tr>
<td>2</td>
<td><a href="http://microsoft.com">microsoft</a></td>
</tr><tr>
<td>3</td>
<td><a href="http://amazon.com">amazon</a></td>
</tr>
</table>
<input type="button" onclick="tableToExcel('tablename', 'name', 'myfile.xls')" value="Export to Excel">
+2
source to share