Sto tentando di aggiungere una funzionalità di opzione di download csv nel mio sito web. Dovrebbe convertire la tabella html presente nel sito Web in contenuto csv e renderla scaricabile. Ho cercato su internet un buon plugin e ho trovato alcuni utili come http://www.dev-skills.com/export-html-table-to-csv-file/ ma usa lo script php per fare la parte di download. Mi stavo chiedendo se c'è una libreria javascript pura disponibile per fare questa funzione utilizzando i software lato server come node.js senza l'uso di PHP ??export html table a csv
risposta
Utilizzando solo jQuery
e vaniglia Javascript
:
export-to-html-table-as-csv-file-using-jquery
Mettete questo codice in uno script da caricare nella sezione head
:
$(document).ready(function() {
$('table').each(function() {
var $table = $(this);
var $button = $("<button type='button'>");
$button.text("Export to spreadsheet");
$button.insertAfter($table);
$button.click(function() {
var csv = $table.table2CSV({
delivery: 'value'
});
window.location.href = 'data:text/csv;charset=UTF-8,'
+ encodeURIComponent(csv);
});
});
})
Note:
Richiede jQuery e table2CSV: Aggiungi rif. Script erenze su entrambe le librerie prima dello script sopra.
Il selettore table
viene utilizzato come esempio e può essere regolato in base alle proprie esigenze.
Funziona solo nei browser con il pieno supporto Data URI
: Firefox, Chrome e Opera, non in IE, che supporta solo Data URIs
per incorporare i dati immagine binari in una pagina.
Per la compatibilità completa con il browser, è necessario utilizzare un approccio leggermente diverso che richiede uno script lato server su echo
CSV.
Ciao ... grazie per la risposta ... ma quando Provo a scaricare il file tabletoCsv dal link che hai fornito .. mostra l'errore "pagina non trovata" – sam
Ciao @sam, puoi trovare la libreria qui: http://www.table2csv.com/ – melancia
Grazie per il rispondere!!! Apprezzo davvero il tuo aiuto !! Ho trovato un'altra opzione interessante anche dopo un sacco di ricerca http://www.datatables.net/examples/ – sam
Non è necessario lo script PHP sul lato server. Non che nel lato client solo nei browser che accettano Data URIs:
data:application/csv;charset=utf-8,content_encoded_as_url
I dati URI sarà qualcosa di simile:
data:application/csv;charset=utf-8,Col1%2CCol2%2CCol3%0AVal1%2CVal2%2CVal3%0AVal11%2CVal22%2CVal33%0AVal111%2CVal222%2CVal333
È possibile chiamare questo URI da:
- utilizzando
window.open
- o impostazione di
window.location
- o dall'href di un'ancora
- aggiungendo l'attributo di download che funzionerà in chrome, devono ancora eseguire il test in IE.
Per testare, copiare semplicemente gli URI sopra e incollare nella barra degli indirizzi del browser.O testare l'ancora al di sotto in una pagina HTML:
<a download="somedata.csv" href="data:application/csv;charset=utf-8,Col1%2CCol2%2CCol3%0AVal1%2CVal2%2CVal3%0AVal11%2CVal22%2CVal33%0AVal111%2CVal222%2CVal333">Example</a>
Per creare il contenuto, ottenendo i valori dalla tabella, è possibile utilizzare table2CSV menzionato da MelanciaUK e fare:
var csv = $table.table2CSV({delivery:'value'});
window.location.href = 'data:application/csv;charset=UTF-8,' + encodeURIComponent(csv);
C'è molto soluzione facile libero e open source a http://jordiburgos.com/post/2014/excellentexport-javascript-export-to-excel-csv.html
prima scaricare il file javascript e file di esempio dalla https://github.com/jmaister/excellentexport/releases/tag/v1.4
La pagina html ha l'aspetto seguente.
Assicurarsi che il file javascript si trovi nella stessa cartella o modificare di conseguenza il percorso dello script nel file html.
<html>
<head>
<title>Export to excel test</title>
<script src="excellentexport.js"></script>
<style>
table, tr, td {
border: 1px black solid;
}
</style>
</head>
<body>
<h1>ExcellentExport.js</h1>
Check on <a href="http://jordiburgos.com">jordiburgos.com</a> and <a href="https://github.com/jmaister/excellentexport">GitHub</a>.
<h3>Test page</h3>
<br/>
<a download="somedata.xls" href="#" onclick="return ExcellentExport.excel(this, 'datatable', 'Sheet Name Here');">Export to Excel</a>
<br/>
<a download="somedata.csv" href="#" onclick="return ExcellentExport.csv(this, 'datatable');">Export to CSV</a>
<br/>
<table id="datatable">
<tr>
<th>Column 1</th>
<th>Column "cool" 2</th>
<th>Column 3</th>
</tr>
<tr>
<td>100,111</td>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
<td>600</td>
</tr>
<tr>
<td>Text</td>
<td>More text</td>
<td>Text with
new line</td>
</tr>
</table>
</body>
E 'molto facile da usare questo come ho provato la maggior parte degli altri metodi.
Ho trovato che esiste una libreria per questo. Vedi l'esempio qui:
https://editor.datatables.net/examples/extensions/exportButtons.html
Oltre al codice di cui sopra, i seguenti file libreria JavaScript vengono caricati per l'uso in questo esempio:
In HTML, includere script seguenti:
jquery.dataTables.min.js
dataTables.editor.min.js
dataTables.select.min.js
dataTables.buttons.min.js
jszip.min.js
pdfmake.min.js
vfs_fonts.js
buttons.html5.min.js
buttons.print.min.js
Abilita i pulsanti aggiungendo script come:
<script>
$(document).ready(function() {
$('#table-arrays').DataTable({
dom: '<"top"Blf>rt<"bottom"ip>',
buttons: ['copy', 'excel', 'csv', 'pdf', 'print'],
select: true,
});
});
</script>
Per qualche motivo, l'esportazione excel risulta in un file danneggiato, ma può essere riparata. In alternativa, disabilitare excel e utilizzare l'esportazione csv.
- 1. export csv in zend framework
- 2. PowerShell - Export-CSV e aggiungere
- 3. Export da HTML a PDF (C#)
- 4. org-mode html export
- 5. Export risultato della query in Pervasive a txt/csv
- 6. PostgreSQL: export CSV con linebreaks sfuggiti
- 7. Export-CSV lunghezza esportazione ma non nome
- 8. Come export csv da MySQL utf8
- 9. Export JasperReports in formato HTML
- 10. html table to powerpoint
- 11. Html table tr inside td
- 12. angularjs crea/export html visualizza come pdf
- 13. Export CSV o PDF basato su datatables Laravel 4
- 14. Import/Export CSV dal SQLite da codice C#
- 15. php invia email html con allegato .csv
- 16. filtro su django-import-export
- 17. Table = Table vs Table.Data (Table)
- 18. mysql import wizard table non riesce a importare un file csv
- 19. Convertire la tabella HTML in un CSV automaticamente usando PHP?
- 20. Grails Export Plugin errori
- 21. Responsive "table"
- 22. Automated Export Failed
- 23. C# Dizionario a .csv
- 24. gpg --export-secret-keys
- 25. ES6 `export * from import`?
- 26. Web API restituisce file csv
- 27. HTML da Excel a Excel Javascript
- 28. R knitr - kable table html formatting for small text
- 29. SolidWorks to OBJ export
- 30. Alternativa al layout <table> in HTML
possibile duplicato di [Esporta in CSV in jQuery] (http://stackoverflow.com/questions/4639372/export-to-csv-in-jquery) –