Form en ajax (ayudanovato, desesperao y rayado xD)

[manumar]

hola, bueno vamos a ver si me conseguis decir el porque de este royo que no entiendo porque me pasa...tengo un form con 2 campos para login...otro archivo .php q procesa y el .js...
Cuando acierta en los datos te redirecciona a otro lao, cuando no quiero cambiar las clases..lo tipico xD
Pues bien, os enseño mi codigo porque resulta q para q funcione bien tengo q cambiar el contenido del form, por la cara ya os digo, si no lko cambio no funciona

Código PHP:

  <div id="login"><form id="login-f" onSubmit="envlogin()"><label>Correo:</label><input type="text" id="correo" class="input1"><br/><br/>
<label>Contrase&ntilde;a:</label><input type="password" id="pass" class="input1">
<button id="botonEnviar" onClick="envlogin()" type="submit"></button>
</form>
<span id="envloginImg"><img src="temas/original/iconos/loading.gif">Enviando...</span>
</div> 
   

.js

Código javascript:

onload=function() {
correo=document.getElementById("correo");
pass=document.getElementById("pass");
form=document.getElementById("login-f");
Cform=form.innerHTML;
envio=document.getElementById("envloginImg");
urlp="funciones/proc-login.php";
}
 
function nuevoAjax()
{ 
    var xmlhttp=false; 
    try 
    { 
        // No IE
        xmlhttp=new ActiveXObject("Msxml2.XMLHTTP"); 
    }
    catch(e)
    { 
        try
        { 
            // IE 
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
        } 
        catch(E) { xmlhttp=false; }
    }
    if (!xmlhttp && typeof XMLHttpRequest!="undefined") { xmlhttp=new XMLHttpRequest(); } 
    return xmlhttp; 
}
 
function envlogin() {
 
envio.style.display="block";
mail=correo.value;
passw=pass.value;
form.style.display="none";
 
var ajax=nuevoAjax();
        ajax.open("POST", urlp, true);
        ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        ajax.send("correo="+mail+"&pass="+passw);
        
        ajax.onreadystatechange=function()
        {
            if (ajax.readyState==4)
            {
                envio.style.display="none";
                var respuesta=ajax.responseText;
                if(respuesta=="OK")    {
                window.location.href="?sitio=panel";
                }                
                else {
                form.style.visibility="visible";
                if(respuesta=="correo") {correo.className="error";}
                else {pass.className="error";}
                
                
                }
            }
        }
}
 

procesador..

Código PHP:

  <?php
session_start();
if ($_POST) {
include ('BD.php');
foreach($_POST as $clave => $valor) $$clave=addslashes(trim(utf8_decode($valor)));
$mail=mysql_escape_string($correo);
$passw=md5($pass);
$usu=mysql_query("SELECT `ID`,`Mail`,`Rango`, `Pass` FROM `Usuarios` WHERE `Usuarios`.`Mail`='$mail' LIMIT 1");
if ($Dusu=mysql_fetch_array($usu)) {
if ($passw==$Dusu[Pass]) {
$_SESSION[ID]=$Dusu[ID];
$_SESSION[Correo]=$Dusu[Mail];
$_SESSION[Rango]=$Dusu[Rango];
echo 'OK';
}
else { echo 'pass'; }
}
else { echo 'correo';}
}
?>   

Resulta q cuando dejo el mismo contenido del form, la redireccion se hace mal, se hace como un reload..total q es muy raro...
Posiblemente sea uan tonteria, pero es q me cansao de buscar. Ademas, este es mi primer script con Ajax, y bueno...alomejor estoy comentiendo fallos.

Por favor orientenme

gracias y salu2

[caricatos]

Hola:

A grandes rasgos... es bueno que uses un botón del tipo submit por lo de la accesibilidad, pero luego tienes que cancelar el envío si no quieres que el formulario se envíe...

También parece innecesario el evento onclick en un botón tipo submit... prueba quitando es onclick y el en form cancelar el envío...

Código:

<form onsubmit="envlogin(); return false">

Saludos

[manumar]

Alucinante caricatos xD FUNCIONA PERFECTO!!

Estoy seguro que es por el return false...pero nose exactamente porque, me lo puedes explicar?

salu2