racheld Posted November 13, 2009 Share Posted November 13, 2009 Please help!I am very, very new at the whole web development thing and need a bit of help with figuring out the simplest way to convert a basic csv file into an html table with a verticle scroll bar. Like with all things there is a catch, and that is my client will need to change the linked csv document on a regular basis so this process needs to be made as simple as possible.I found what seemed like fairly clean javascript code that claims to do what I want, but I can't seem to make it work. I tried to insert the " HTML Header data" and " HTML footer data" directly into the html code but that doesn't seem to work either.Below is both my js and html code. Any help solving this problem would be immensely appreciated!!! //javascript// The names of our input and output filesvar src = "toronto_Nov09.csv";var dest = "results.html";// Create some variablesvar fso, fin, fout;var data = new Array();// Define constants for file accessvar forReading = 1;var forWriting = 2;var forAppending = 8; // not used - given for reference// Create File System Object and open input and output filesfso = new ActiveXObject( "Scripting.FileSystemObject" );fin = fso.OpenTextFile( src, forReading );fout = fso.OpenTextFile( dest, forWriting, true );// create file if not found// Write out header and start of tablefout.WriteLine( htmlHeader() );fout.WriteLine( "<table border='0' cellpadding='1' cellspacing='0' width='100%'>" );// Loop through entire filewhile( !fin.AtEndOfStream ){ try { // Read the next line var line = fin.ReadLine(); // If line if blank - skip it if( line == "" ) continue; // Fill our array 'data' which csv data split at ',' // If you are using a different seperator, such as a TAB // you will need to modify the next item // Some examples // data = line.split( "\t" ); // for tab // data = line.split( ":" ); // for colon // data = line.split( " " ); // for space data = line.split( "," ); // Start our table ROW fout.WriteLine( "<tr>" ); // Loop through data elements found on current line for( i = 0; i < data.length; i++ ) { // write TD tags to wrap data fout.WriteLine( "<td>" + data[i] + "</td>" ); } // Close the ROW fout.WriteLine( "</tr>\r\n" ); } catch( e ) { WScript.Echo( "Error: " + e.description ); }}// Close TABLEfout.WriteLine( "</table>" );// Close HTML pagefout.WriteLine( htmlFooter() );// Close input and output filesfin.Close();fout.Close(); /******************************* HTML Header data********************************/function htmlHeader(){ var title = "CSV2HTML"; var head = "<html>\r\n<head>\r\n"; // Title head += "<title>" + title + "</title>\r\n"; // Style Sheet head += "<style>\r\n"; head += " TD { \r\n"; head += " font-family: verdana;\r\n"; head += " font-size: 10pt; \r\n"; head += " border-bottom: thin groove lightyellow;\r\n"; head += " border-top: thin groove lightyellow;\r\n"; head += " color: blue; background: lightgrey;\r\n"; head += " }\r\n"; head += "</style>\r\n"; head += "</head>\r\n<body>\r\n"; return( head );}/******************************** HTML Footer data*********************************/function htmlFooter(){ var foot = "\r\n</body>\r\n</html>"; return( foot );} <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title>Untitled Document</title><script type="text/javascript" src="csv2html.js"></script></head><body><!--<form id="commentForm" action="csvWithphp.php" method="post" onSubmit="return false;"></form>--><p>My csv conversion test</p></body></html> Link to comment Share on other sites More sharing options...
justsomeguy Posted November 13, 2009 Share Posted November 13, 2009 You can't use Javascript to do that, you'll either need to use PHP or ASP or something similar. I don't know if that Javascript would run or not, but if it did it would only run in IE and it would only act on a local file, so whoever looked at the page would need the CSV on their computer, and it would output an HTML page on their computer. Your form tag points to a PHP script so if you have that available you can use fgetcsv to read the file:http://us3.php.net/manual/en/function.fgetcsv.php Link to comment Share on other sites More sharing options...
racheld Posted November 13, 2009 Author Share Posted November 13, 2009 You can't use Javascript to do that, you'll either need to use PHP or ASP or something similar. I don't know if that Javascript would run or not, but if it did it would only run in IE and it would only act on a local file, so whoever looked at the page would need the CSV on their computer, and it would output an HTML page on their computer. Your form tag points to a PHP script so if you have that available you can use fgetcsv to read the file:http://us3.php.net/manual/en/function.fgetcsv.php Okay, thanks for your advice, I will try the php route. As for the form tag, that was a previous test that I forgot to delete before I uploaded my post...bad form on my part! Link to comment Share on other sites More sharing options...
racheld Posted November 13, 2009 Author Share Posted November 13, 2009 Okay, thanks for your advice, I will try the php route. As for the form tag, that was a previous test that I forgot to delete before I uploaded my post...bad form on my part!I got the PHP to work so thanks for that! Now I am having trouble getting the php to display on the html page. I've used <form action="csvWithphp.php"></form>. Should I be using a get method here?THANKS! Link to comment Share on other sites More sharing options...
racheld Posted November 13, 2009 Author Share Posted November 13, 2009 PROBLEM SOLVED! Thanks! Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.