Problemas con DIV en AJAX

[cjkike]

Buenos Días!

Estoy realizando un desarrollo y me he conseguido con un problema con el uso de las etiquetas <div>

EL problema es el Siguiente:

Estoy realizando el inicio de sesion de un Site, para lo cual utilizo ajax.

Es una tabla que contiene un formulario y este formulario contiene los datos para el inicio de sesion. Al pulsar el icono de envio el realiza la validacion de los campos con Javascript y luego, si esta todo ok, llama a la funcion que ejecuta el AJAX para validar los datos. Hasta aqui todo funciona de maravilla.

Posteriormente, si el resultado es positivo, el AJAX imprime dentro de las etiquetas DIV del formulario, en caso contrario escribe tambien pero otro texto.

Específicamente el problema es que en Mozilla funciona todo correctamente, pero en el IE no modifica los texto.

En principio las etiquetas <div> estaban ubicadas posteriormente a las Etiquetas <td> y funcionaba bien en ambos navegadores. (ejemplo: <td><div></div></td>).

Ahora las tengo ubicadas antes de un <tr> y como digo, solo en mozilla funciona.
(ejemplo: <div><tr><td></td></tr></div>). Tendra esto algo que ver???

Incluyo el Código:

HTML:

<table width="318" height="82" border="0" cellpadding="0" cellspacing="0" class="cuadro_sesion">
<form name="form" method="post" action="./index.php">
<div id="contenedor">
<tr>
<td width="293" height="8" class="inicio_sesion_rojo">&nbsp;&nbsp;Anonimo</td>
<td width="25" height="8" class="inicio_sesion_rojo"></td>
</tr>
</div>
<tr>
<td height="1" colspan="2" align="center" valign="middle"><img src="./imagenes/raya_login.gif" width="318" height="1"></td>
</tr>
<tr>
<td height="8" class="inicio_sesion_negro" colspan="2">&nbsp;&nbsp;&nbsp;Correo electrónico:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&n bsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Contraseña:</td>
</tr>
<tr>
<td height="8">&nbsp;&nbsp;
<input type="text" size="21" name="email" class="inicio_sesion_text"/>&nbsp;&nbsp;&nbsp;
<input type="password" size="21" name="password" class="inicio_sesion_text"/>
</td>
<td width="25" height="8" class="inicio_sesion" align="center">
<input type="image" src="./imagenes/botones/boton_login.gif" value="" onclick="return inicio_sesion()">
</td>
</tr>
<tr>
<td height="8" align="right" colspan="2" class="inicio_sesion_gris"><b>Olvido su contraseña | <a href="./index.php?id=1">Regístrese</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</b></td>
</tr>
</form>
</table>


Codigo Javascript:
//Funcion que valida el formulario y llama al ajax
function inicio_sesion() {
var txterrores='';
var error = false;

if(document.form.email.value==''){
txterrores+='- Debe ingresar su correo electrónico\n';
alert('Error al procesar el Formulario: \n'+txterrores);
document.form.email.focus();
return false;
}
if(document.form.password.value=='') {
txterrores+='- Debe ingresar su Contraseña\n';
alert('Error al procesar el Formulario: \n'+txterrores);
document.form.password.focus();
return false;
}
iniciar_sesion(document.form.email.value,document. form.password.value);
return false;
}




//funcion que ejecuta el ajax
function iniciar_sesion(mail,password) {

var contenedor1;
contenedor1 = document.getElementById("contenedor");
ajax=nuevoAjax();
ajax.open("GET", "./include/login.php?email="+mail+"&password="+password,true) ;
alert ('abrio conexion a ajax');
ajax.onreadystatechange=function() {
if (ajax.readyState==4) {

contenedor1.innerHTML = "Cargo"; //Este texto es solo de prueba
}else {
contenedor1.innerHTML="cargando!"; //Este texto es solo de prueba
}
}
ajax.send(null);
}

Mucho agradeceria su colaboración!

Saludos

kike

[ZiTAL]

porque no maquetas sin tablas y lo haces solo con capas?

[aloqui]

Pues como creo que el problema viene de que lo tienes mal aquietado como dice ZiTAL.
Tienes
<table>
<form>
<div id="contenedor">
<tr>
<td>...</td>
</tr>
<div>
...
</form>
</table>

Yo creo que el form debe estar fuera de la tabla.
El div no lo necesitas, o el id se lo asignas a un tr o a un td, pero no a un div metido ahí a capón ya que no encaja dentro de una tabla.
Otra opcion es poner el div dentro de un td pero no ahí como si fuera un tr.

[cjkike]

Muchas Gracias a ambos por sus respuesta!

Resolvi eliminando la tabla y construyendola totalmente con div.

Ahora, el FORM no lo coloco fuera del Table porque aunque en el Mozilla se ve bien, en el IE deja un espacio blanco luego de la tabla.

Y por otro lado, es necesario que coloque el DIV ya que ese trozo es precisamente el que se recarga al usar el AJAX.

Muchas gracias por su colaboracion