Fallo en maquetacion con FIrefox, perfecto en IE

[jevymetal69]

Muy buenas os comento:
REsulta que tengo una función que hace aparecer y desaparecer las filas de la Tabla, y según pulse en un check box la fila desapare... La funcionalidad va perfectamente en IE y Firefox, y lo he hecho ocultando y mostrando según la ID del TR, lo malo es que en FIrefox la maquetación se desordena totalmente y no sé que hacer... Al quitar el atributo ID del TR en firefox sale bien maquetado pero claro ya no puedo trabajar con ella al perder el ID... Necesito que funcione bien en ambos navegadores... Muchas gracias por adelantado , un saludo

[jmdz]

¿Podrías mostrarnos el código?

[jevymetal69]

Iniciado por jmdz

¿Podrías mostrarnos el código?

EL problema es que sale la tabla en el Firefox descolocado del todo...
Y no sé que hacer...

<table width="65%" border="0" cellspacing="1" cellpadding="0" align="center">
<tr>

<td valign="bottom" class="h01" colspan=2>MOTIVOS ACEPTACION ANALISTA</td>

</tr>
<tr>

<td valign="bottom" class="cel01" width="9%" align="center">CODIGO</td>
<td valign="bottom" class="cel01" width="81%" align="center">ANALISTA</td>

</tr>

<tr>

<script>
for (i=1;i<4;i++)
{

document.write("<tr id='LineaMotivoAceptacionAnalista"+i+"' style='display:block'>");
document.write("<td colspan=2 class='invertir'>");
document.write("<input type='checkbox' onclick='cambiaEstilo(\"LineaMotivoAceptacionAnali sta"+i+"\");' class='input01' name='CheckMotivo"+i+"' >");
document.write("AA ");
document.write("0"+i+" ");
document.write("&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbs p;&nbsp;&nbsp;");
document.write(MotivosAceptacionAnalista(i));
document.write("<td/>");
document.write("<tr/>");
}
</script>


</table>


function cambiaEstilo(IdObjeto)
{

if(document.getElementById(IdObjeto).className=="i nvertir")
document.getElementById(IdObjeto).className = 'estandar';
else
document.getElementById(IdObjeto).className = 'invertir';


}

[jmdz]

Te paso tu código revisado, mira los comentarios que incluí, maquetar maqueta bien (ahora), pero no se si funcionara lo de ocultar (para eso me faltaría ver la definición de las clases CSS). Saludos.

Código HTML:

<script>
function cambiaEstilo(IdObjeto)
{
    if(document.getElementById(IdObjeto).className=="invertir")/* habia un espacio en el nombre de la clase, decia 'i nvertir' */
        document.getElementById(IdObjeto).className='estandar';
    else
        document.getElementById(IdObjeto).className='invertir';
}
</script>
 
<table width="65%" border="0" cellspacing="1" cellpadding="0" align="center">
    <tr> 
        <td valign="bottom" class="h01" colspan=2>MOTIVOS ACEPTACION ANALISTA</td>
    </tr>
    <tr> 
        <td valign="bottom" class="cel01" width="9%" align="center">CODIGO</td>
        <td valign="bottom" class="cel01" width="81%" align="center">ANALISTA</td><!-- ojo que 9%+81%=90% de la tabla que a su ves es el 65% del body (o de lo que la contenga) -->
    </tr>
    <tr>
    <script>
for(i=1;i<4;i++)
{
    document.write("<tr id='LineaMotivoAceptacionAnalista"+i+"' style='display:'>");/* 'display:block'? corresponde table-cell, lo dejo en blanco por que no se que habra en el CSS */
    document.write("<td colspan=2 class='invertir'>");
    document.write("<input type='checkbox' onclick='cambiaEstilo(\"LineaMotivoAceptacionAnalista"+i+"\");' class='input01' name='CheckMotivo"+i+"' >");/* habia un espacio en el nombre de la clase, decia 'LineaMotivoAceptacionAnali sta' */
    document.write("AA ");
    document.write("0"+i+" ");
    document.write("&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;");/* habia un espacio dentro de una de las entidades */
//  document.write(MotivosAceptacionAnalista(i));/* comento esta linea porque no nos pasaste el código de esta funcion */
    document.write("</td>");/* decia '<td/>', el elmento TD no es de modelo de contenido vacio y esta es una etiqueta de cierre */
    document.write("</tr>");/* idem arriba */
}
    </script>
</table>
 

[bng5]

En realidad sería mucho mejor que uses DOM en lugar de document.write.

EDIT

Iniciado por jevymetal69

Al quitar el atributo ID del TR en firefox sale bien maquetado pero claro ya no puedo trabajar con ella al perder el ID

Eso no es correcto: el atributo rows del objeto Table te permite acceder a todas sus filas a través del índice.

[jevymetal69]

Mil gracias a los dos, me habeis resuelto el problema...
EMpezaré a trabajar con DOM que es realmente interesante y potente..
Lo dicho muchas gracias...

[jevymetal69]

Tengo otra cuestión:
Me gustaría saber de que manera puedo recorrer todas las tablas existentes en el docuento y cojer su ID ...
Estoy haciendo esto pero no me sale nada...
A ver si os ocurriera algo...
var ListaTablas = document.getElementsByTagName("Table");

for (var i = 0; i < ListaTablas.length; i++){

alert("dentro-->" + ListaTablas[i].getNamedItem("id").value);
alert("dentro-->" + ListaTablas[i].attributes.item("id").nodeValue);
alert("dentro-->" + ListaTablas[i].attributes.getNamedItem("id").nodeValue);

}

[bng5]

Código:

var ListaTablas = document.getElementsByTagName("Table");
// ListaTablas es ahora una colección de objetos del tipo HTMLTableElement

for (var i = 0; i < ListaTablas.length; i++) {
    alert("id: " + ListaTablas[i].id);
}

[jevymetal69]

Muchas gracias¡¡ Que obviedad más grande y sin verla¡¡ Madre mía... jajjaa
Muchas gracias de nuevo¡