Este es el código actualizado:
Código:
<script>
function cancelar(event)
{
event.preventDefault();
valida();
}
var READY_STATE_COMPLETE=4;
var peticion_http = null;
var XX;
function inicializa_xhr()
{
if(window.XMLHttpRequest)
{
return new XMLHttpRequest();
}else if(window.ActiveXObject)
{
return new ActiveXObject("Microsoft.XMLHTTP");
}
}
function crea_query_string()
{
var user = document.getElementById("login");
var clave = document.getElementById("passw");
return "login=" + encodeURIComponent(user.value) +
"&passw=" + encodeURIComponent(clave.value);
}
function valida()
{
peticion_http = inicializa_xhr();
if(peticion_http)
{
peticion_http.onreadystatechange = procesaRespuesta();
peticion_http.open("POST", "http://www.sistemagrial.es/sig/service/autentication.php", true);
peticion_http.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
var query_string = crea_query_string();
peticion_http.send(query_string);
}
}
function procesaRespuesta()
{
if(peticion_http.readyState == READY_STATE_COMPLETE)
{
if(peticion_http.status == 200)
{
document.getElementById("respuesta").innerHTML = peticion_http.responseText;
}
}
}
</script>
</head>
<body onload="init();">
<div data-role="page" id="inicio">
<div data-role="header">
<h1>Login</h1>
</div>
<div data-role="content">
<form id="formulario" onsubmit="cancelar(event)">
<input type="text" id="login" name="login" placeholder="login" required>
<input type="password" id="passw" name="passw" placeholder="passw" required>
<input type="submit" value="Acceder" id="submit" onClick="valida()">
<input type="reset" name="Borrar" id="Borrar" value="Reset" class="boton">
</form>
</div>
</div>
<div id="respuesta">
</div>
Lo que sucede es que hace un amago de que a pasar de la página de login pero vuelve a ella al instante.