javascript - vnd - html5 to excel
Exportando tabla HTML a Excel usando Javascript (6)
El 2016-07-12, Microsoft lanzó una actualización de seguridad para Microsoft Office. Uno de los efectos de esta actualización fue evitar que Excel abra archivos HTML de dominios que no son de confianza, ya que no se pueden abrir en modo Protegido.
TAMBIÉN hay una configuración de registro que evita que Excel abra archivos con la extensión de archivo .XLS cuyo contenido no coincida con el formato oficial de archivo XLS, aunque su configuración predeterminada es "advertir", no "negar".
Antes de este cambio, era posible guardar datos HTML en un archivo con una extensión XLS, y Excel lo abriría correctamente, posiblemente advirtiéndole primero que el archivo no coincidía con el formato de Excel, dependiendo del valor del usuario para el ExtensionHardening clave de registro (o valores de configuración relacionados).
Microsoft ha hecho una entrada en la base de conocimientos sobre el nuevo comportamiento con algunas soluciones sugeridas.
Varias aplicaciones web que anteriormente dependían de la exportación de archivos HTML como XLS han tenido problemas como resultado de la actualización: SalesForce es un ejemplo.
Es probable que las respuestas anteriores al 12 de julio de 2016 a esta y otras preguntas similares no sean válidas ahora.
Vale la pena señalar que los archivos producidos EN EL EXPLORADOR a partir de datos remotos no entran en conflicto con esta protección; solo impide que los archivos descargados de una fuente remota no sean de confianza. Por lo tanto, un enfoque posible es generar el archivo HTML con la etiqueta .XLS localmente en el cliente.
Otra, por supuesto, es producir un archivo XLS válido, que Excel abrirá en modo protegido.
ACTUALIZACIÓN : Microsoft ha lanzado un parche para corregir este comportamiento: https://support.microsoft.com/en-us/kb/3181507
Estoy exportando la tabla HTML a forls xls . Después de exportarlo, si lo abre en Libre Office, funciona bien, pero lo mismo abre una pantalla en blanco en Microsoft Office.
No quiero una solución jquery , por favor proporcione cualquier solución javascript . Por favor ayuda.
function fnExcelReport() {
var tab_text = "<table border=''2px''><tr bgcolor=''#87AFC6''>";
var textRange;
var j = 0;
tab = document.getElementById(''table''); // id of table
for (j = 0; j < tab.rows.length; j++) {
tab_text = tab_text + tab.rows[j].innerHTML + "</tr>";
//tab_text=tab_text+"</tr>";
}
tab_text = tab_text + "</table>";
tab_text = tab_text.replace(/<A[^>]*>|<//A>/g, ""); //remove if u want links in your table
tab_text = tab_text.replace(/<img[^>]*>/gi, ""); // remove if u want images in your table
tab_text = tab_text.replace(/<input[^>]*>|<//input>/gi, ""); // reomves input params
var ua = window.navigator.userAgent;
var msie = ua.indexOf("MSIE ");
if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv/:11/./)) // If Internet Explorer
{
txtArea1.document.open("txt/html", "replace");
txtArea1.document.write(tab_text);
txtArea1.document.close();
txtArea1.focus();
sa = txtArea1.document.execCommand("SaveAs", true, "Say Thanks to Sumit.xls");
} else //other browser not tested on IE 11
sa = window.open(''data:application/vnd.ms-excel,'' + encodeURIComponent(tab_text));
return (sa);
}
<iframe id="txtArea1" style="display:none"></iframe>
Call this function on
<button id="btnExport" onclick="fnExcelReport();"> EXPORT
</button>
<table id="table">
<thead>
<tr>
<th>Head1</th>
<th>Head2</th>
<th>Head3</th>
<th>Head4</th>
</tr>
</thead>
<tbody>
<tr>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
</tr>
<tr>
<td>21</td>
<td>22</td>
<td>23</td>
<td>24</td>
</tr>
<tr>
<td>31</td>
<td>32</td>
<td>33</td>
<td>34</td>
</tr>
<tr>
<td>41</td>
<td>42</td>
<td>43</td>
<td>44</td>
</tr>
</tbody>
</table>
Si el formato CSV es bueno para usted, aquí hay un ejemplo.
- Ok ... acabo de leer un comentario donde explícitamente dices que no es bueno para ti. Mi mal por no aprender a leer antes de codificar.
Por lo que sé, Excel puede manejar CSV.
function fnExcelReport() {
var i, j;
var csv = "";
var table = document.getElementById("table");
var table_headings = table.children[0].children[0].children;
var table_body_rows = table.children[1].children;
var heading;
var headingsArray = [];
for(i = 0; i < table_headings.length; i++) {
heading = table_headings[i];
headingsArray.push(''"'' + heading.innerHTML + ''"'');
}
csv += headingsArray.join('','') + ";/n";
var row;
var columns;
var column;
var columnsArray;
for(i = 0; i < table_body_rows.length; i++) {
row = table_body_rows[i];
columns = row.children;
columnsArray = [];
for(j = 0; j < columns.length; j++) {
var column = columns[j];
columnsArray.push(''"'' + column.innerHTML + ''"'');
}
csv += columnsArray.join('','') + ";/n";
}
download("export.csv",csv);
}
//From: http://.com/a/18197511/2265487
function download(filename, text) {
var pom = document.createElement(''a'');
pom.setAttribute(''href'', ''data:text/csv;charset=utf-8,'' + encodeURIComponent(text));
pom.setAttribute(''download'', filename);
if (document.createEvent) {
var event = document.createEvent(''MouseEvents'');
event.initEvent(''click'', true, true);
pom.dispatchEvent(event);
}
else {
pom.click();
}
}
<iframe id="txtArea1" style="display:none"></iframe>
Call this function on
<button id="btnExport" onclick="fnExcelReport();">EXPORT
</button>
<table id="table">
<thead>
<tr>
<th>Head1</th>
<th>Head2</th>
<th>Head3</th>
<th>Head4</th>
</tr>
</thead>
<tbody>
<tr>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
</tr>
<tr>
<td>21</td>
<td>22</td>
<td>23</td>
<td>24</td>
</tr>
<tr>
<td>31</td>
<td>32</td>
<td>33</td>
<td>34</td>
</tr>
<tr>
<td>41</td>
<td>42</td>
<td>43</td>
<td>44</td>
</tr>
</tbody>
</table>
añade esto a tu cabeza:
<meta http-equiv="content-type" content="text/plain; charset=UTF-8"/>
y agrega esto como tu javascript:
<script type="text/javascript">
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]--><meta http-equiv="content-type" content="text/plain; charset=UTF-8"/></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) {
if (!table.nodeType) table = document.getElementById(table)
var ctx = {worksheet: name || ''Worksheet'', table: table.innerHTML}
window.location.href = uri + base64(format(template, ctx))
}
})()
</script>
Jfiddle: http://jsfiddle.net/cmewv/537/
prueba esto
<table id="exportable">
<thead>
<tr>
//headers
</tr>
</thead>
<tbody>
//rows
</tbody>
</table>
Script para esto
var blob = new Blob([document.getElementById(''exportable'').innerHTML], {
type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8"
});
saveAs(blob, "Report.xls");
<hrml>
<head>
<script language="javascript">
function exportF() {
//Format your table with form data
document.getElementById("input").innerHTML = document.getElementById("text").value;
document.getElementById("input1").innerHTML = document.getElementById("text1").value;
var table = document.getElementById("table");
var html = table.outerHTML;
var url = ''data:application/vnd.C://Users/WB-02/desktop/Book1.xlsx,'' + escape(html); // Set your html table into url
var link = document.getElementById("downloadLink");
link.setAttribute("href", url);
link.setAttribute("download", "export.xls"); // Choose the file name
link.click(); // Download your excel file
return false;
}
</script>
</head>
<body>
<form onsubmit="return exportF()">
<input id="text" type="text" />
<input id="text1" type="text" />
<input type="submit" />
</form>
<table id="table" style="display: none">
<tr>
<td id="input">
<td id="input1">
</td>
</tr>
</table>
<a style="display: none" id="downloadLink"></a>
</body>
</html>