Question:
I am trying to process a table and its rows and cells on an HTML page. I have given the Table, TR and TD elements IDs. I am trying to do processing on all the values in the table–essentially setting the value of the cell. My question is how do I access the object hierarchy to get access to all the values? I have been trying to use document.all[“Table1”] where Table1 is the ID of my table element. When I do this I can’t access a value from the object. I am just trying now to get it to echo back like so MsgBox document.all[“Table1”].id. Seems to me it should give me back “Table1”. Beyond this point what would be my syntax to get at a cell? Something like document.all[“Table1”][“Row1”][“Cell1”].innertext ? Any help would be greatly appreciated. Thanks.

Answer:
Here’s a good chance for me to clear up one of the great misconceptions about the Internet Explorer 4.0 Document Object Model: the all() function. That’s right, FUNCTION.

The documentation for IE4 is remarkably bad about indicating the fact that all() is not a collection. Instead, when the HTML document gets parsed by the browser it searches for all instances of the ID attribute within tags and adds them to an internal data structure. This structure is essentially a Dictionary object–a collection of name-value attributes, although it’s a little more complex than that.

When you call the all() function with a parameter, IE searches that internal ID collection, then returns a pointer to the element that ID corresponds to. If there are more than one items with the same ID, the all() function actually returns a zero based collection of references.

The all() function is actually not the best way to get a handle to elements, because it doesn’t know anything about the object it’s returning beyond the most basic fact that it is a DHTML element. It is the equivalent in scripting language to late binding in Visual Basic or Visual C++; this will become more obvious with the release of Visual Interdev later this year.

If you know the name of the object you want to reference you can get a handle to it with the window object. For example, a table reference named tbl can be addressed either as document.all(“tbl”) or window.tbl.

Okay, back to the original topic of the question: referencing table cells. Tables are complicated entities. If a table could be counted on to have n rows by m columns then accessing a table cell would be a simple proposition. However, it is possible for a table cell to span more than one row or column, which means that different rows may have different numbers of columns. Rather than create a simple area as a consequence, Microsoft created two sets of collections: the rows collection, and the cells collection. In this model, a table is made up of rows. The rows collection then contains one or more cells. Each cell is an element, and should be treated as if it were a div statement or something similar.

Most of the time, you may be uninterested in making your table exotic, and you may want to just access row n at column m. The GetRC function (below) does just that:

The id of the table is passed to the function, along with the row and column you wish to access. In the first line of the function itself, the table objTable is retrieved with the all function. In the next line a Row object is retrieved through the use of the item(row) syntax. This is basically the same as saying var objRow=objTable.rows[row]. Once the row is retrieved, you can query its cell collection to get the cell that you want. Finally, the content of the cell is kept as a DHTML node, which you can retrieve with the innerText property.

I have a small Web page that demonstrates this functionality. It has three rows (including one header) and four columns representing an item, its cost, the number of the item and the total cost for that item. In the code, a button press will multiply the second and third items together, place the product in the fourth (the total), then sum up all of the totals for a grand total which appears below the table.

The length method returns the number of items in the tables, rows and cells collections. Notice that the collections are all zero based--the reason I start with the row 1 and cell 1 (rather than row 0 and cell 0) is because I don't want to include the product names or headers in the calculation.

Hope that helps.