[thelist] Workaround for setAttribute bug in IE7?

[Edwin Martin]

Ryan Rushton wrote:
> I have a table that lists items (1 per row).  When the user clicks on an 
> item I want to insert a new row directly below the clicked item and pull 
> in a summary from a database.  My code works fine in Firefox, but in IE 
> the line: newCell.setAttribute("colspan",8); doesn't seem to set the 
> colspan.  Any suggestions for a workaround?
>   
Have you tried newCell.colSpan=8?

(I wonder why people use setAttribute so much, while the HTML-DOM has
all these ready-to-use properties).

http://www.w3.org/TR/REC-DOM-Level-1/ecma-script-language-binding.html

More info about table manipulation in IE:
http://msdn.microsoft.com/workshop/author/tables/buildtables.asp

Edwin Martin


>
> the HTML:
> <table id="myList" summary="A list of items." class="mgmt">
> <caption>Item List</caption>
> ...
> <tr id="record10490">
>     <td><input type="checkbox" name="items" class="inputCheck" 
> id="10490" value="10490" /></td>
>     <td>154</td>
>     <td>10490</td>
>     <td><a 
> href="itemDescription.do?action=getItems&display=details&items=10490" 
> onclick="toggleSummary('10490'); return false;">Item One</a></td>
>     <td>12/8/06</td>
>     <td>Active</td>
>     <td>John Doe</td>
>     <td><a href="item.do?action=editItem&id=10490">edit</a></td>
> </tr>
> ...
>
> the JavaScript:
> // Display/hide the summary for a given item
> function toggleSummary(recID) {
>    var thisTable = document.getElementById('myList');
>    var itemRowId = 'record' + recID;
>    var itemRow = document.getElementById(itemRowId);
>    var itemRowCells = itemRow.getElementsByTagName("td");
>    var itemBgColor = itemRowCells[1].style.backgroundColor;
>    var summaryRowId = 'summary' + recID;
>    var summaryRow = document.getElementById(summaryRowId);
>
>     // toggle off
>     if (summaryRow != null) {
>         thisTable.deleteRow(summaryRow.rowIndex);
>     }
>
>     // toggle on
>     else {
>         var newRowIndex = itemRow.rowIndex + 1;
>         var newRow = thisTable.insertRow(newRowIndex);
>         newRow.setAttribute("id",summaryRowId);
>         var newCell = newRow.insertCell(0);
>         newCell.setAttribute("colspan",8);
>         newCell.style.backgroundColor = itemBgColor;
>         newCell.innerHTML = '<iframe 
> src="itemDescription.do?action=getItems&display=details&items=' +recID 
> +'" frameborder="0" class="itemDescription"></iframe>';
>     }
>   return false;
> }
>   


-- 
http://www.bitstorm.org/