↑
Main Page

HTML code

The concept
Keep in mind is that each cell in a table must have a sortable value, meaning a value that is a string, inte-
ger, float, or date. Because all HTML code can’t be converted directly into one of these data types, you
need to specify an alternate value to sort by. This can be accomplished by adding an extra attribute on
each
<td/>
that contains HTML, like this:
<td value=”blue”><img src=”blueimage.gif” /></td>
Because this table cell contains an image, you normally wouldn’t be able to sort it. However, the addition
of the
value
attribute specifies that the value to sort is
“blue”
, not the contents of the
<td/>
element.
And as you learned earlier, it is possible to access this new attribute using the DOM
getAttribute()
method:
var sValue = oTD.getAttribute(“value”);
Now, it isn’t necessary to add a
value
attribute to every cell in a table, because this gives you a lot of
redundant information. You should only add the attribute to those table cells containing HTML code.
For example, the following table lists filenames along with their associated icons. Note that only the first
column uses the extra
value
attribute:
<table border=”1” id=”tblSort”>
<thead>
<tr>
<th>Type</th>
<th>Filename</th>
</tr>
</thead>
<tbody>
<tr>
<td value=”doc”><img src=”images/wordicon.gif”/></td>
<td>My Resume.doc</td>
</tr>
<tr>
<td value=”xls”><img src=”images/excelicon.gif”/></td>
<td>Fall Budget.xls</td>
</tr>
<tr>
<td value=”pdf”><img src=”images/acrobaticon.gif”/></td>
<td>How to be a better programmer.pdf</td>
</tr>
<tr>
<td value=”doc”><img src=”images/wordicon.gif”/></td>
<td>My Old Resume.doc</td>
</tr>
<tr>
<td value=”txt”><img src=”images/notepadicon.gif”/></td>
<td>Notes from Meeting.txt</td>
</tr>
<tr>
<td value=”zip”><img src=”images/zippedfoldericon.gif”/></td>
<td>Backups.zip</td>
382
Chapter 12
15_579088 ch12.qxd 3/28/05 11:40 AM Page 382


JavaScript EditorFree JavaScript Editor     Ajax Editor


©

→