Autor Tema: Ajax. Métodos open, send, getResponseHeader, setRequestHeader. CU01209F# (Leído 2600 veces)

pedro,, · « **en:** 16 de Marzo 2016, 22:02 »

Hola, ejercicio CU01209F del curso de programación web Ajax desde cero.

Citar

JERCICIO Nº1
Crea un archivo denominado respuesta.php que contenga el código necesario para devolver lo siguiente:
a) Si se recibe el parámetro nombre con valor alberto, la frase “Alberto está realizando un curso de programación”.
b) Si se recibe el parámetro nombre con valor juan, la frase “Juan está realizando prácticas de ingeniería de sistemas”
c) Si el parámetro viene vacío o no existe, la frase “No hay información. Revise la petición”.
En un archivo denominado peticion.html crea una casilla de texto que pida un nombre y un botón chequear, de modo que al pulsarse el botón chequear se produzca una petición vía Ajax para obtener los resultados contenidos en el archivo respuesta.php. Dichos resultados deberán mostrarse en una ventana de alerta JavaScript cada vez que se pulse el botón chequear.

html...

Código: [Seleccionar]

<!DOCTYPE html>
<html>
	<head>
		<title>Cursos aprende a programar</title><meta charset="utf-8">		
		<script>
			function mostrarSugerencia() {
				var xmlhttp = new XMLHttpRequest();
				var nodoMostrarResultados = document.getElementById('muestraResultado');
				var nombre = document.getElementById('nombre').value;	
				xmlhttp.onreadystatechange = function() {
					if (xmlhttp.readyState==4 && xmlhttp.status==200) {
						nodoMostrarResultados.innerHTML = xmlhttp.responseText;
					}
				}				 
				xmlhttp.open("GET", "ajaxCU01209.php?nombre=" + nombre, true);
				xmlhttp.send();
			}			
		</script>
	</head>
	<body style="margin:20px;">
		<h2>Introduce un nombre:</h2>
			Nombre: <input type="text" id="nombre" name="nombre" value="" />
	<button type="button" onclick="mostrarSugerencia()">Chequear</button>
		<br/>
		<div id="muestraResultado"> </div>
	</body>
</html>

php...

Código: [Seleccionar]

<meta charset = "utf-8"/>
<?php
	function comprobarNombre($nombre) {
		if(strtolower($nombre) == 'juan') {
			return 'Juan está realizando prácticas de ingeniería de sistemas';
		} else if(strtolower($nombre) == 'alberto') {
			return 'Alberto está realizando un curso de programación';
		} else {
			return 'No hay información. Revise la petición';
		}
	}
	$nombreRecibido = $_REQUEST["nombre"];
	echo '<br/><h1>' . comprobarNombre($nombreRecibido) . '</h1>'; 
?>

Citar

EJERCICIO Nº2
Crea un archivo denominado respuesta1.txt que contenga varias líneas de texto y súbelo al servidor. Haz lo mismo para los archivos respuesta2.txt y respuesta3.txt. A continuación crea un archivo html donde usando Ajax y tres botones denominados “Ver archivo 1”, “Ver archivo 2” y “Ver archivo 3” puedas visualizar el contenido de cada archivo en un div preparado para ello encima del cual aparecerá “Contenido del archivo solicitado es:”.

Código: [Seleccionar]

<!DOCTYPE html>
<html>
	<head>
		<title>Cursos aprende a programar</title><meta charset="utf-8">		
		<script>
			function mostrarArchivo(nombreArchivo) {
				var xmlhttp = new XMLHttpRequest();
				var nodoMostrarResultados = document.getElementById('muestraResultado');
				xmlhttp.onreadystatechange = function() {
					if (xmlhttp.readyState==4 && xmlhttp.status==200) {
						nodoMostrarResultados.innerHTML = xmlhttp.responseText;
					}
				}				 
				xmlhttp.open("POST", nombreArchivo, true);
				xmlhttp.send();
			}			
		</script>
	</head>
	<body style="margin:20px;">
		<h2>Elige archivo:</h2>
		<button type="button" onclick="mostrarArchivo('archivo1.txt')">Ver archivo 1</button>
		<button type="button" onclick="mostrarArchivo('archivo2.txt')">Ver archivo 2</button>
		<button type="button" onclick="mostrarArchivo('archivo3.txt')">Ver archivo 3</button>
		<br/>
		<h1>Contenido del archivo seleccionado: </h1>
		<div id="muestraResultado"> </div>
	</body>
</html>

En el siguiente enlace están los dos ejercicios...
http://aprendehtml.byethost3.com/Ajax/CU01209F/

Saludos.

Mario R. Rancel · « **Respuesta #1 en:** 19 de Marzo 2016, 14:35 »

Buenas tardes Pedro, todo correcto

Saludos

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación

Noticias:

Autor Tema: Ajax. Métodos open, send, getResponseHeader, setRequestHeader. CU01209F# (Leído 2600 veces)

pedro,,

Ajax. Métodos open, send, getResponseHeader, setRequestHeader. CU01209F#

Mario R. Rancel

Re:Ajax. Métodos open, send, getResponseHeader, setRequestHeader. CU01209F#

Preguntas y respuestas

Foros aprenderaprogramar.com Didáctica y divulgación de la programación

Noticias:

Autor Tema: Ajax. Métodos open, send, getResponseHeader, setRequestHeader. CU01209F# (Leído 2600 veces)

pedro,,

Ajax. Métodos open, send, getResponseHeader, setRequestHeader. CU01209F#

Mario R. Rancel

Re:Ajax. Métodos open, send, getResponseHeader, setRequestHeader. CU01209F#

Preguntas y respuestas

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación