Import CSV File to HTML Table

Hi

 Our warehouse team would like displayed on a big telly mounted on the wall the packing stats for each individual packer.

 We can export as a CSV or tab delimited text file the packer's username, full name and number of parcels despatched from our ERP system every minute so that the file has up-to-date data in it.  What I need to do is figure out a way of presenting this data on the big screen ideally in a nicely formatted table.

 Does anyone know of a simple way of doing this (I have no experience of writing any sort of code)?  Or a third party software solution than can do such a thing?

I have attached an example output file from our system.

Many thanks
pick.csv
LVL 1
admincbfAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Big MontySenior Web Developer / CEO of ExchangeTree.org Commented:
Your best bet is to use some kind of server side language to do this, although there are straight JavaScript solutions out there, which, IMO, are not as straightforward to follow. There are a lot of examples on the net for php, .net,, classic asp, etc. Once you decide on a technology, I can better help you.
0
AndrewSwingewoodCommented:
Is your ERP database accessible via ODBC?  If it is, the best way may be to interface directly into the tables using SQL to extract the data directly to a JSP page and just refresh the page automatically every minute or so.  Much more efficient than parsing and displaying CSV data all the time.
What software/database hosts the ERP system?  Is it Oracle, MS SQL Server or something similar?
0
RobOwner (Aidellio)Commented:
Given this is internal, export the csv to an web accessible folder so that your html page can access it.

Then just use the <meta> tag with the refresh attribute to reload the page every N second.

The demo below using jQuery and a plugin called Papa Parse for parsing csv files (http://papaparse.com/)

I modified your pick.csv to comma separated as it was space separated.

<!DOCTYPE html>
<html>
<head>
	<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
	<script src="http://papaparse.com/resources/js/papaparse.js"></script>
	<script src="main.js"></script>
	<link rel="stylesheet" href="main.css">
  <meta charset="utf-8">
<meta http-equiv="refresh" content="120"><!-- REFRESH EVERY 2 minutes -->
  <title>JS Bin</title>
</head>
<body>
	<table id="results">
		<tbody>
		</tbody>
	</table>
	
</body>
</html>

Open in new window


javascript:
$(function() {
	Papa.parse("pick.csv", {
		download: true,
		complete: function(results) {
			console.log("Remote file parsed!", results.data);
			$.each(results.data, function(i, el) {
				var row = $("<tr/>");
				row.append($("<td/>").text(i));
				$.each(el, function(j, cell) {
					if (cell !== "")
						row.append($("<td/>").text(cell));
				});
				$("#results tbody").append(row);
			});
		}
	});
});

Open in new window


CSS:
#results {
	width: 100%;
	border-collapse: collapse;
}
table, th, td {
	border: 1px solid black;
}

Open in new window

pick.csv
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
You might want to look into any hooks the ERP system may have.  Sometimes there area API's and you can use javascript to hit that ERP and send some data to your screen.   Otherwise, Rob's solution is the way to go and will probably be the easiest in the end.
0
admincbfAuthor Commented:
Thanks very much for the thorough solution
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.