Foros aprenderaprogramar.com
Aprender a programar => Aprender a programar desde cero => Mensaje iniciado por: VictorDevelop en 27 de Mayo 2017, 10:16
-
Buenos dias. Tengo un problema con el ejercicio CU01212F del curso básico de programación web con Ajax.
Mediante alerts he visto que status coge el valor 404,no encontrado,y me gustaria saber por que y cómo lo arreglo.
Este es el código html:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Alta Usarios</title>
<script type="text/javascript">
function UsuarioExistente(nombre)
{
//alert("Dentro de la funcion");
var xmlhttp;
var nombreRecibido = nombre;
var contenidoMostrar = "";
//Valor del label de respuesta
var valorLabelRespuesta = document.getElementById("UsuarioExiste");
var respuestaExisteMostrar = "";
//Si no se le ha pasado ningun valor
if (nombreRecibido.length == 0)
{
document.getElementById("UsuarioExiste").innerHTML = "";
return;
}
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function ()
{
//alert("Antes del If que comprueba respuesta ReadyStateVale=>"+xmlhttp.readyState+"Y Status:"+xmlhttp.status);
if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
{
alert("Dentro del if");
nombreRecibido = xmlhttp.responseText.split;
for ($i = 0; $i < nombreRecibido.length; $i++)
{
alert("DentroDelfor"+nombreRecibido[i]);
}
}
if (xmlhttp.status == 404)
{
alert("Error=>" + Error);
return;
}
alert("Despues del If que comprueba respuesta ReadyStateVale=>" + xmlhttp.readyState + "Y Status:" + xmlhttp.status);
}
var paramentros = 'nombreUsuario' + encodeURIComponent(nombreRecibido);
xmlhttp.open('POST', 'altaUsuarios.php'); // Método post y url invocada
xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); // Establecer cabeceras de petición
xmlhttp.send(paramentros); // Envio de parámetros usando POST
}
</script>
</head>
<body>
<h1>Alta Usarios</h1>
<form method="">
<label style="padding-right:20px;">Usuario</label>
<input name="nombreUsuario" onBlur="UsuarioExistente(this.value)"/>
<label name="UsuarioExiste"></label>
<br />
<label style="padding-right:15px;">Nombre</label>
<input name="nombre"/>
<br />
<label style="padding-right:5px;">Apellidos</label>
<input name="apellidos" />
<input type="submit" value="Enviar"/>
</form>
</body>
</html>
Y este el pequeño fichero php:
<?php
//Nombres alojados
$nombres[0]="Jose";
$nombres[1]="Fernando";
$nombres[2]="Juan";
$msg="";
$nombreRecibido=$_POST["nombreUsuario"];
echo"DentroDealtausuarios.php";
$existeUsuario=false;
for($i=0;$i<count($nombres);$i++)
{
if($nombres[$i]==$nombreRecibido)
{
$msg="El usuario ".$nombres[$i]."Ya existe";
$existeUsuario=true;
}else
{
$msg="Usuario ".$nombres[$i]."esta disponible";
}
}
echo $msg;
?>
Alguna idea?
Saludos.
-
Buenas VictorDevelop.
Lo primero recomendarte leer el siguiente post, donde encontrarás las normas básicas de como publicar en el foro, donde está explicado como incluir el código correctamente en tus mensajes...
https://www.aprenderaprogramar.com/foros/index.php?topic=1460.msg7784#msg7784
El archivo php lo tienes mal planteado, de la forma que lo tienes, si introducimos "Jose" devolvería que el usuario está disponible, ya que la primera vez que se recorre el bucle si habrá coincidencia pero como el bucle se seguirá ejecutando en la siguientes pasadas del bucle no se cumplirá esa coincidencia y $msg dirá que el nombre está disponible.
Este sería el códiog php retocado:
<?php
//Nombres alojados
$nombres[0]="Jose";
$nombres[1]="Fernando";
$nombres[2]="Juan";
$msg="";
$nombreRecibido=$_POST["nombreUsuario"];
$existeUsuario=false;
for($i=0;$i<count($nombres);$i++)
{
if($nombres[$i]==$nombreRecibido) {
$existeUsuario=true;
}
}
if($existeUsuario == true) {
$msg="El usuario ".$nombreRecibido." ya existe";
} else {
$msg="Usuario ".$nombreRecibido." esta disponible";
}
echo $msg;
?>
Y el código del archivo html también habría cosas que cambiar. En primer lugar, haces varias veces lo siguiente:
document.getElementById("UsuarioExiste");cuando en tu código no existe ningún elemento que tenga como id "UsuarioExiste".
Tu función recibe un parámetro llamado nombre que luego asignas a una variable cuando no haría falta esto último, estarías ocupando en memoria dos veces lo mismo pero con distinto nombre, esto no es un error, pero se puede mejorar.
Dentro del siguiente if...
nombreRecibido = xmlhttp.responseText.split;No necesitas crear ningún array, puesto que lo que se recibirá será una frase que dice si está o no está disponible el nombre enviado.
En la siguiente línea de código:
var paramentros = 'nombreUsuario' + encodeURIComponent(nombreRecibido);Te faltaría añadir un signo igual(=) después de 'nombreUsuario',
Y aquí el código html sin errores y funcionando:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Alta Usarios</title>
<script type="text/javascript">
function UsuarioExistente(nombre)
{
var xmlhttp;
var respuestaConsulta = '';
//Valor del label de respuesta
var valorLabelRespuesta = document.getElementById("UsuarioExiste"); // no existe ningun elemento con este id.
//Si no se le ha pasado ningun valor
if (nombre.length == 0) {
document.getElementById("UsuarioExiste").innerHTML = "";
return;
}
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
respuestaConsulta = xmlhttp.responseText;
valorLabelRespuesta.innerHTML = respuestaConsulta;
}
if (xmlhttp.status == 404) {
alert("Error=>" + Error);
return;
}
}
var paramentros = 'nombreUsuario=' + encodeURIComponent(nombre);
xmlhttp.open('POST', 'altaUsuarios.php'); // Método post y url invocada
xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); // Establecer cabeceras de petición
xmlhttp.send(paramentros); // Envio de parámetros usando POST
}
</script>
</head>
<body>
<h1>Alta Usarios</h1>
<form action="">
<label style="padding-right:20px;">Usuario</label>
<input name="nombreUsuario" onBlur="UsuarioExistente(this.value)"/>
<label name="UsuarioExiste" id="UsuarioExiste"></label>
<br />
<label style="padding-right:15px;">Nombre</label>
<input name="nombre"/>
<br />
<label style="padding-right:5px;">Apellidos</label>
<input name="apellidos" />
<input type="submit" value="Enviar"/>
</form>
</body>
</html>
Saludos. ;D
-
Muchas gracias por tan completa respuesta.
Mirare las normas para compartir codigo.