Display CSV Files in an HTA

HTA provides a simple GUI interface for the Tabular Data Control

Bill Stewart

December 10, 2006

11 Min Read
ITPro Today logo


Over the last several weeks, I've been working extensively with comma-separated value (CSV) files. One simple example is the component I described in "Gathering File System Data" (October 2006, Instant-Doc 93451), FileDB.wsc, which saves information about files to a CSV file. CSV files are plain-text database files in which each line represents a record (row) that's divided into fields (columns), with commas separating data items from each other, as Figure 1 shows. The first line (sometimes called a header line) of the CSV file contains the field or column names, and subsequent lines contain the data. Double-quote characters define individual items in case a data item contains a comma. CSV files can contain an arbitrary number of lines, and they might not contain a header line that contains the field names. As I worked with the output from FileDB.wsc, I realized that an HTML application (HTA) would be an ideal way to quickly and easily view CSV files. Let's take a look at the HTA I wrote and see how the scripting behind it makes it work.

An HTA is a dynamic HTML (DHTML) document with an .hta extension that runs at a higher privilege level than Internet Explorer (IE). As such, HTAs can use any available ActiveX objects on the computer, even those that aren't marked as "safe for scripting" for IE. For example, an HTML document that attempts to use the FileSystemObject will generate a warning message if you open the document in IE because the FileSystemObject is not marked "safe for scripting." (And this is a good thing, because otherwise any Web site that you browse in IE could potentially access the local file system.) In contrast, HTAs run in mshta.exe, which allows access to all ActiveX objects on the computer. As such, HTAs need to be treated with the same care as scripts or executables, but they provide a convenient way to create GUI-based applications.

The Microsoft Tabular Data Control (TDC) simplifies the creation of an HTA for viewing CSV files. The TDC is an ActiveX object that lets you display CSV-based data in an HTML table. It's a core IE component that first appeared in IE 4.0 and is available on every Windows OS that has IE 4.0 or later. The HTA I wrote, CSVviewer.hta, is a convenient tool for anyone who needs to view a CSV file but doesn't need a data-analysis tool such as a spread-sheet or a database. The CSVviewer .hta script is too long to print in its entirety here, but you can download it from the Windows IT Pro Web site at http://www.windowsitpro.com/windowsscripting, InstantDoc ID 94260.

The CSVviewer.hta script generates a screen like the one that Figure 2 shows. The HTA is straightforward: Simply enter the name of a CSV file or click Browse to select a file, then click OK. If the CSV file's first line doesn't contain field names, deselect the First line of CSV file contains field names check box. The Display x records per page setting (where x is a number between 1 and 999) defines the number of CSV file records that the application will display at one time. To clear the form and start over with a different CSV file, click Reset. Finally, you can click Exit to close the application.

After you've selected a CSV file and clicked OK, the data from the file appears in a table in the lower half of the window along with a Filter button and a set of navigation buttons, as Figure 2 shows. The Filter button provides access to the TDC's Filter property, which I explain in a moment. The First Page, Last Page, Previous Page, and Next Page buttons let you navigate through the data. You can also sort the data by clicking the column headings. The first click of a column heading will perform an ascending sort; subsequent clicks on the same column heading will reverse the sort order with each click.

A Peek Under the Hood
CSVviewer.hta is easy to use, but there's plenty of scripting under the hood that makes it work. I wanted CSVviewer.hta to be able to display data from an arbitrary CSV file; that is, I didn't want to "hard-code" the column names and the CSV file's name into the document. The CSVviewer.hta script accomplishes these goals by reading the column headings and setting the appropriate TDC properties at runtime.

Creating the object reference. Before you can use the TDC in an HTML or HTA document, you need to insert an

Sign up for the ITPro Today newsletter
Stay on top of the IT universe with commentary, news analysis, how-to's, and tips delivered to your inbox daily.

You May Also Like