-1
Good morning guys, someone has to give me a help regarding to export an HTML table to PDF and EXCEL, I better do this in javascript(front end) or java (backend) any hint help! thanks.
2 answers
6
I better do this in javascript(front end) or (backend)?
It is better to do this in the back end for security reasons. A page HTML can be manipulated, and thereby have your data manipulated. If you do this in the back end, you return the true values to the file that will be exported, regardless of the output format.
That said, I will post a simple way to do this using jQuery.
<input type="button" id="btnExport" value=" Export Table data into Excel " />
<br/>
<br/>
<div id="dvData">
<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>
</table>
</div>
<script>
$("#btnExport").click(function (e) {
window.open('data:application/vnd.ms-excel,' + $('#dvData').html());
e.preventDefault();
});
</script>
See a full example in this Fiddle.(Font on the link).
If you want a full Javascript example, this answer can help you.
There are some libraries that do this too, such as the Excellentexport.js.
Already in java, you can do as follows, according to that reply.
Workbook wb = new HSSFWorkbook();
Sheet personSheet = wb.createSheet("PersonList");
Row headerRow = personSheet.createRow(0);
Cell nameHeaderCell = headerRow.createCell(0);
Cell addressHeaderCell = headerRow.createCell(1);
String sql = "select name, address from person_table";
PrepareStatement ps = connection.prepareStatement(sql);
ResultSet resultSet = ps.executeQuery();
int row = 1;
while(resultSet.next()) {
String name = resultSet.getString("name");
String address = resultSet.getString("address");
Row dataRow = personSheet.createRow(row);
Cell dataNameCell = dataRow.createCell(0);
dataNameCell.setCellValue(name);
Cell dataAddressCell = dataRow.createCell(1);
dataAddressCell.setCellValue(address);
row = row + 1;
}
String outputDirPath = "D:/PersonList.xls";
FileOutputStream fileOut = new FileOutputStream(outputDirPath);
wb.write(fileOut);
fileOut.close();
-
Thanks for the reply @Randrade, very simple example worked perfectly for excel (both back and front), by chance Oce also does not have a code to export p/ PDF ><?
-
"An HTML page can be manipulated, and thus have its data manipulated.". Anyone can duplicate the file and modify it if they want, If it is STRICTLY NECESSARY to leave the table safe by the back end will need an authentication system of these tables with hash signatures. Simply generate the table in the back-end will only generate unnecessary processes, Imagine if a user exports a 500 thousand line report? It will jam the entire server, so it’s best to do it on the front end and let the client handle the processing.
5
Good morning, You may be using 2 jquery plugins, follow the example:
<!DOCTYPE html>
<html lang="en" class="no-js">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>Export HTML table to Excel Format With Jquery- WSnippets.com</title>
<meta name="description" content="Export HTML table to Excel Format With Jquery- WSnippets.com" />
<link rel="stylesheet" href="style.css" />
<!--[if lt IE 9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
</head>
<body>
<div class="wrapper">
<div id="test">
<div class="wrapper">
<h2>WSnippets.com - Export HTML table to Excel Format With Jquery</h2>
<div id="dv">
<table id="tblExport" style="border:1px solid black; ">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
</tr>
</thead>
<tbody>
<tr>
<td style='background-color:red;'>1</td>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
</tr>
<tr>
<td>2</td>
<td>Jacob</td>
<td>Thornton</td>
<td>@fat</td>
</tr>
<tr>
<td>3</td>
<td>Larry</td>
<td>the Bird</td>
<td>@twitter</td>
</tr>
</tbody>
</table>
</div>
<div>
<button id="btnExport">Export to excel</button>
</div>
</div>
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="jquery.btechco.excelexport.js"></script>
<script src="jquery.base64.js"></script>
<script>
$(document).ready(function () {
$("#btnExport").click(function () {
$("#tblExport").btechco_excelexport({
containerid: "tblExport"
, datatype: $datatype.Table
, filename: 'sample'
});
});
});
</script>
</body>
</html>
Here is a tutorial from the original author and on the page contains the files for download.
http://codigosimples.net/2014/11/27/exportar-html-para-excel-com-jquery/
-
1
Hello @Otacio, although the link answer the question, would you be good to bring the code to your answer, will the internet explode and only this site is affected? : p
-
1
When you have 50 reputation points you can put this kind of hint as a comment on the question. The website is intended to be a library of solutions, not links. And the answers that earn points are those that show the solution, those of this type here are flagged to be deleted...
-
Thanks for the reply @Otacio Barbosa, it worked right for excel, by chance Voce also does not have for PDF no ?
-
Have this one, plus this one I haven’t tested yet, test case please return if you can:http://w3lessons.info/2015/07/13/export-html-table-to-excel-csv-json-pdf-png-using-jquery/
-
Randrade and Review - Diego F and brasfilo , answer changes and inserted the codes.
-
@Otacio Barbosa, this scheme did not work for me because I need to export to PDF but rendering CSS
Browser other questions tagged javascript java html pdf
You are not signed in. Login or sign up in order to post.
Regarding Otácio Barbosa’s reply, his script does not work for table with more than 30 thousand records, from the failure to download the file, someone can help?
– Luiz Henrique Correia