Close

Javascript: Exportar Tabla HTML a Excel

Es muy rara la ocasión en la que nosotros queremos generar un Excel del lado del Cliente por lo regular lo generamos del lado de servidor, generando una consulta a la base de datos y descargando el contenido con algún lenguaje del servidor.

Hubo una ocasión donde tenía un reporte donde era pesado y todavía que se tardaba en retornar algo la consulta de PHP , se quedaba pintando una tabla en PHP para posteriormente descargarlo a XLS.

Ahora simplemente genero el Query, me traigo el JSON y lo pinto desde Javascript para descargarlo con la siguiente función que encontré en internet adaptándola a mis necesidades:

Si nosotros pintamos la tabla con un JSON y esa tabla la vamos guardando en una variable usen el siguiente método:  

variable_conTabla = «<table><thead><th>ALGO</th><th>ALGO2</th></thead><tbody><tr><td>2015-02-18 19:45</td><td>ALGO</td><td>ALGO</td><td>ALGO</td><td>ALGO</td></tr><tr><td>2015-02-14 12:46</td><td>ALGO</td><td>ALGO</td><td>CARGADA</td><td>ALGO</td></tr></tbody></table>»;

Si nosotros tenemos ya una tabla pintada dentro de nuestro DOM usamos lo siguiente:

 

22 thoughts on “Javascript: Exportar Tabla HTML a Excel

  1. Muy buena ayuda, lo que tengo como duda es si hay alguna forma de almacenar el excel en el servidor al momento de almacenarlo.

  2. Como hacer que respete el formato contenido en la tabla?
    Me refiero a si en la tabla tengo este valor: 0001, en el Excel lo guarda como 1. Lo interpreta como numérico.

    A partir de ya gracias.

    1. Listo! Le agregué un Style al que necesitaba que fuera texto, así:

      001

      De esta manera, al llegar a excel en lugar de pintarme «1», me pinto correctamente «001» en la celda.

      Ahora me falta que trabaje en Mozilla FireFox 🙁

        1. Saludos, es una excelente publicación y me ayudo mucho funciona al 100%. Se que la publicación tiene ya algún tiempo, pero para quien le pueda interesar, el problema de los ceros a la izquierda lo resolví aplicando un estilo a la celda de la siguiente manera:

          .style0
          {
          mso-style-name:Normal;
          mso-style-id:0;
          }

          .xl65
          {
          mso-style-parent:style0;
          mso-number-format:»\@»;
          }

          y en la celda:
          Celda 10

  3. Hola! Muchas gracias por el aporte, cómo puedo configurar para que queden los datos centrados en sus celdas?

    Muchas Gracaias!

  4. Disculpa amigo como le hago para que me descargue respetando los acentos en las palabras? Ya tengo la etiqueta al inicio de mi html.

    Pero después de descargarlo y abrirlo en Excel me muestra las palabras sin acentos.
    ¿Podrías ayudarme?

  5. Alguien que me pueda explicar un poco mejor sobre como solucionar el tema de los ceros a la izquierda? («001») entiendo que se debe agregar un estilo pero no me quedo muy claro en donde va ese estilo..

  6. en mi caso los caracteres con acentuación o ce dilias del portugués que se muestran correctamente en mi tabla en la web, me los exporta a Excel con un mucho caracteres raros. Habrá que agregar alguna otra cosa al codigo?

Leave a Reply

Your email address will not be published. Required fields are marked *

*

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.