Login | Register   
RSS Feed
Download our iPhone app
Browse DevX
Sign up for e-mail newsletters from DevX


Manipulate Data in Internet Explorer with the Tabular Data Control

The Tabular Data Control is an ActiveX control built into Internet Explorer (versions 4 and upwards). You can use this control to extract ordered contents from an ASCII file into HTML elements, and then display them—with a little help from JavaScript.

n my last article, I explained how to use the XML Data Source Object to extract content from an external XML file or XML data embedded in the HTML file into a HTML page.

In this article, I will be using a similar process to demonstrate how to use the Tabular Data Control. This is an ActiveX control that's built into Internet Explorer (versions 4 and upwards), which allows you to extract ordered (delimited) contents from an ASCII file into HTML elements.

Suppose you have a text file that contains three fields (which can be compared to tables in a database). If the fields are delimited by a specific character, (such as a comma or tab character), you can identify the values and extract them for use elsewhere, such as in an HTML page.

This functionality is especially useful if you have relatively small amounts of data that need to be updated frequently and require client-side scripting. Basically, it acts like a small database.

The only disadvantage of this control is that it works with MSIE only.

In this article, I'll take you through four examples, each of increasing difficulty, that will show how to use the Tabular Data Control.

Getting Started
Initialize the tabular data control in a Web page using the <OBJECT> tag and the control's CLASSID (unique identifier), like this:

<OBJECT ID="SomeID" CLASSID="CLSID:333C7BC4-460F-11D0-BC04-0080C7055A83"> ... ... ... </OBJECT>

Any object has a number of parameters. An object's parameters are specified using the <PARAM> tag. The tabular data control has around 7 parameters. Here are the more important ones:
  • DataURL: Shows the path of the file that contains the data. For example, "data.txt".
  • UseHeader: Normally, this parameter is always set to true, which means you should use the field name for referencing a particular field. In some applications, the field name (header) may not be required. In that case, the default value is false.
  • TextQualifier: This is that character at the beginning and end of a text that qualifies that text. For example, "~My name is Premshree~." Here the TextQualifier is "~".
  • FieldDelim: The Field Delimiter distinguished between the different data fields of the data file. Consider a data file with the fields name, age, and sex. The values for these fields will be written as "*SomeName*|*SomeAge*|*SomeSex*." Here, "|" is the field delimiter and "*" is the text qualifier.
Complete initialization will look like this:

<OBJECT ID="SomeID" CLASSID="CLSID:333C7BC4-460F-11D0-BC04-0080C7055A83"> <PARAM NAME="DataURL" VALUE="YourDataFile.txt"> <PARAM NAME="UseHeader" VALUE="TRUE"> <PARAM NAME="TextQualifier" VALUE="~"> <PARAM NAME="FieldDelim" VALUE="|"< </OBJECT>

The parameter names are not case sensitive.