Disappearing Links in IE

[zatoichi]

Hi,

 

I hope that someone can help me with a very strange problem.

 

This page works perfectly in FireFox 2.0.0.4, but has problems in IE6 and 7.

My web page uses an Ajax updated table to display sales quotes. 

When I click on a link in one table cell, all links in some subsequent rows disappear from the screen when the following javascript is executed:

  node.className = newClassName;

 

Trying to be brief:

I start by Ajax loading a table into my content div.  This is an HTML load to innerHTML.

The table has a header row and several hidden rows {display:none} that are used as templates.

Loading the blank table triggers an Ajax XML transfer that:

  1) reads XML sales quote data from PHP/MySQL via httpRequest,

  2) clones (cloneNode(true)) one of several row templates,

  3) changes id and className of the cloned row so that it is unique and displayed

  4) adds sales quote info into the cloned row by setting innerHTML in various places

  5) inserts (insertBefore()) the cloned row it into the quote table

 

The inserted row has several links that are used to modify quote content by revealing then submitting forms.

 

THE PROBLEM

Clicking on any link in a top level cell disappears all links that are in tables in a top level cell.

The content is still in the page.  I can see it using alerts. It is just invisible.

Links disappear when the className "containerQ" is changed to a class that displays the contained div {display:block}.

 

All links use the following structure. 

 

<td>

  <div class="containerQ">  //  ******This is where className is changed that causes other content to disappear

  <span>

    // ***********  This is the content that disappears in tables within top level cells

    <a href="#42quote_label" onclick="popupPopup(this);return false;">Quote 1</a>

  </span>

  <div>

    <form onsubmit="popupPopdown(this);return false;" action="/quotes/quotes.php" method="get">

    <input name="dbId" value="42" type="hidden">

    <input name="inputId" value="quote_label" type="hidden">

    <input name="mode" value="updq" type="hidden">

    <table><tbody><tr>

      <td><input value="" name="quote_label" size="50" type="text"></td>

      <td><input src="images/common/update_quote_name.gif" alt="Change Label" type="image"></td>

    </tr></tbody></table>

    </form>

  </div>

  </div>

</td>

 

 

Suggestions PLEASE...