Comment exporter un tableau html comme un fichier xlsx

J'ai une question au sujet de l'exportation d'un tableau html comme un xlsx fichier. J'ai fait un peu de travail, et maintenant je peux l'exporter en tant que xls, mais j'ai besoin de l'exporter en tant que xlsx.

ici mon jsFiddle : https://jsfiddle.net/272406sv/1/

voici mon code html :

<table id="toExcel" class="uitable">
  <thead>
    <tr>
      <th>Kampanya Başlığı</th>
      <th>Kampanya Türü</th>
      <th>Kampanya Başlangıç</th>
      <th>Kampanya Bitiş</th>
      <th style="text-align: center">Aksiyonlar</th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="Item in campaign.campaignList">
      <td> Item.CampaignTitle </td>
      <td> Item.CampaignHotelType </td>
      <td> Item.CampaignHotelCheckInDate) </td>
      <td>Item.CampaignHotelCheckOutDate</td>
      <td style="text-align: center">
        <button> Some Action </button>
      </td>
    </tr>
  </tbody>
</table>

<button onclick="exceller()">EXCEL</button>

ici mon js :

<script>
  function exceller() {
    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];
        })
      }
    var toExcel = document.getElementById("toExcel").innerHTML;
    var ctx = {
      worksheet: name || '',
      table: toExcel
    };
    var link = document.createElement("a");
    link.download = "export.xls";
    link.href = uri + base64(format(template, ctx))
    link.click();
  }

</script>

OriginalL'auteur Erdeniz Korkmaz | 2016-05-28

5

Vous ne serez pas en mesure d'exporter en tant que XLSX sans revenir sur le serveur. Un fichier XLSX est un ensemble de fichiers XML, fermeture zippée. Cela signifie que vous avez besoin de créer plusieurs fichiers. C'est impossible à faire avec JS côté client.

Au lieu de cela, vous devez créer une fonction de récupération des données à partir de votre tableau HTML et l'envoyer à votre serveur. Le serveur peut alors créer le fichier XLSX pour vous (il y a un tas de bibliothèques disponibles pour ça!) et l'envoyer au client pour le téléchargement.

Si vous vous attendez à avoir un énorme jeu de données, la XLSX création sur le serveur devrait être fait comme un async, où vous avertir l'utilisateur lorsqu'il est fait (au lieu d'avoir à l'utilisateur d'attente pour que le fichier soit créé).

Laissez-nous savoir qui de la langue que vous utilisez sur votre serveur, et nous serons en mesure de vous recommander quelques bonnes bibliothèques.

Je vous remercie pour votre aide. J'ai fait quelques recherches et vous avez raison. Je suis en utilisant angularJS pour mon frontend choses et nodejs pour le backend.
Ensuite, prendre un coup d'oeil à github.com/SheetJS/js-xlsx. C'est probablement le plus populaire de la bibliothèque pour travailler avec XLSX en Nœud
Historiquement parlant ... ce "would be" correcte. Avec tous les navigateurs modernes, et même de beaucoup les anciens navigateurs, c'est assez facile à manipuler, même si je ne le recommande pas pour les grands ensembles de données (pour des raisons de performances). Découvrez la bibliothèque, j'ai écrit: clarketm/TableExport; il tire parti de SheetJS/js-xlsx les coulisses de la poignée de l'analyse.

OriginalL'auteur Adrien
7

Un grande côté client outil pour l'exportation de html tables de xlsx, xls, csv, ou txt est TableExport par clarketm (moi). C'est un simple, facile à mettre en œuvre complète de la bibliothèque avec un tas de propriétés configurables et des méthodes.

Installer
```
$ npm install tableexport
```
D'utilisation
```
TableExport(document.getElementsByTagName("table"));

//OR using jQuery

$("table").tableExport(); 
```
La Documentation

Les exemples d'applications pour vous aider à démarrer
Découvrez la compendious docs ou tout simplement sur la tête de TableExport sur Github pour une liste complète des fonctionnalités.

Malheureusement, il ne semble pas gérer formaté (c'est à dire, de style, CSS, etc.) les données. L'exportation est une plaine, non formaté fichier XLSX. Voir aussi: github.com/clarketm/TableExport/issues/125
TableExport n'affirme jamais être en mesure de cartographier les styles CSS pour XLSX feuille de mise en forme. Il a été construit expressément pour parser du HTML complexe des données de la table dans un boîtier robuste, de manière contrôlée et de l'autoriser à être exportés dans différents formats de fichier (par exemple, TXT, CSV, XLS, XLSX) sur le côté client.

OriginalL'auteur Travis Clarke

Prendre un coup d'oeil à tableExport.jquery.plugin ou tableexport.jquery.plugin

Exemple de Code

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>HTML table Export</title>  
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="../lib/js-xlsx/xlsx.core.min.js"></script>
<script type="text/javascript" src="../lib/FileSaver/FileSaver.min.js"></script> 
<script type="text/javascript" src="../lib/html2canvas/html2canvas.min.js"></script>
<script type="text/javascript" src="../tableExport.js"></script>
<script type="text/javaScript">         
var sFileName = 'ngophi';
function ExportXLSX(){
$('#Event').tableExport({fileName: sFileName,
type: 'xlsx'
});
}
</script>
<style type="text/css">
body {
font-size: 12pt;
font-family: Calibri;
padding : 10px;
}
table {
border: 1px solid black;
}
th {
border: 1px solid black;
padding: 5px;
background-color:grey;
color: white;
}
td {
border: 1px solid black;
padding: 5px;
}
input {
font-size: 12pt;
font-family: Calibri;
}
</style>
</head>
<body>  
<a href="#" onClick="ExportXLSX();">DownloadXLSX</a> 
<br/>
<br/>
<div id="Event">
<table>
<tr>
<th>Column One</th>
<th>Column Two</th>
<th>Column Three</th>
</tr>
<tr>
<td>row1 Col1</td>
<td>row1 Col2</td>
<td>row1 Col3</td>
</tr>
<tr>
<td>row2 Col1</td>
<td>row2 Col2</td>
<td>row2 Col3</td>
</tr>
<tr>
<td>row3 Col1</td>
<td>row3 Col2</td>
<td><a href="http://www.jquery2dotnet.com/">http://www.jquery2dotnet.com/</a>
</td>
</tr>
</table>
</div>
</body>
</html>

OriginalL'auteur Mr.Ngo

1

Vous pouvez utiliser ce plug-in pour l'exportation de la table .xlsx

http://sheetjs.com/demos/table.html

C'est le plus de la réponse correcte. Mais a des problèmes avec Safari, Mac OS et IOS

OriginalL'auteur L..

Vous devez vous connecter pour publier un commentaire.

Installer

D'utilisation

La Documentation

Les exemples d'applications pour vous aider à démarrer