Firefox ignores colspan="2" 1

[bmadaras]

I am inputing a table into a <TD> tag using ajax and td.id.innerHTML, the table displays fine but with <td colspan="2"> the table will not span both columns, it work perfectly in IE. I can not figure out why only firefox is ignoring it, I get no errors pertaining to the colspan in my javascript console

 

[tektipsismyfavorite]

how many rows are in your table? make sure there aren't other rows with no colspan or colspan="5" or something like that. I know for a fact colspan works in Firefox. With tables, IE tends to fill in missing cells, where Firefox takes what you give it literally. so if you have row,cell,cell, and then , row, cell, it will not fill in that last cell automatically.

 

[Vragabond]

We'll need to see more of the code to be able to help you. All I can say is that FireFox has absolutely no problems with applying colspan or rowspan at all.

 

[bmadaras]

This is the table row I am inserting into
<tr id="vinTablerow" style="display: none">
<td colspan="2" id="vinTable">
</td>
<td></td>
</tr>

I am using document.getElementById("vinTable").innerHTML = <TABLE border="1"><tr><tH>VIN</tH><TH>Phy Dmg Symbol</TH><TH>Liability Symbol</TH><TH>ABS</TH><TH>Passive Restraints</TH><TH>DRL</TH><TH>Performance Type</TH><TH>Anti-Theft</TH><TH>MR Class</TH></tr><TR ondblclick="updateFormValues(event)" id="row1"><TD id="vin">1234567890</TD><TD id="damage">Physical Damage</TD><TD id="Liability">Liable</TD><TD id="ABS">YES</TD><TD id="Restraint">Auto Seatbelt</TD><TD id="DRL">NO</TD><TD id="performance">Exotic</TD><TD id="theft">Ignition Kill</TD><TD id="MR">High risk</TD></TR><TR ondblclick="updateFormValues(event)" id="row2"><TD id="vin">0123456789</TD><TD id="damage">Dent</TD><TD id="Liability">Not Liable</TD><TD id="ABS">NO</TD><TD id="Restraint">Driver Side Airbag</TD><TD id="DRL">YES</TD><TD id="performance">Slow</TD><TD id="theft">Alarm</TD><TD id="MR">medium risk</TD></TR></TABLE>

then switching the table row to dojo.byId("vinTablerow").style.display="block";
dojo.byId is the same as getElementById

I have also tried
<tr id="vinTablerow" style="display: none">
<td colspan="2" id="vinTable">
</td>
</tr>

Neither seems to make a difference

 

[Vragabond]

As a possible error, default display for table row is table-row and not block. So you're shifting from table-row to none to block and that could confuse FF, which is stricter in these rules than IE. Have you tried just changing the innerHTML without switching the display of the row?

 

[bmadaras]

I did not realize the other options for the display property, and that it woul dhave that effect. A simple switch from block to table-row and everything is well.
Thanks