[SOLUCIONADO] Bloqueada con JavaScript y ajax

urskeks · #1 (**permalink**) 15/02/2013, 14:13

Hola, soy nueva en este tema, y estoy bloqueada. Necesito hacer una página con AJAX, en la que mediante un <select> seleccione un número, y me aparezca un registro de un XML con un id igual a ese numero. Mediante la herramienta XMLHttpRequest consigo que me muestre todo el XML en formato de texto, pero no la seleccionada. ¿Podríais ayudarme? Estoy bloqueada.

Os muestro los códigos:

Código HTML:

 <head>
			<script language="JavaScript" type="text/javascript">
			var peticion01 = null; //Creamos la variable
			//Para Internet Explorer creamos un objeto ActiveX
			if(navigator.appName=="Microsoft Internet Explorer"){
				peticion01 = new ActiveXObject("Microsoft.XMLHTTP");
			}else{
				peticion01 = new XMLHttpRequest;
			}
			function Coger(url) {//Función coger, en esta caso le entra una dirección relativa al documento actual.
				if(peticion01) { //Si tenemos el objeto peticion01
					peticion01.open('GET', url, false); //Abrimos la url, false=forma síncrona
					peticion01.send(null); //No le enviamos datos al servidor.
					
					//Escribimos la respuesta en el campo con ID=resultado
					document.getElementById('resultado').innerHTML=peticion01.responseText;
				}
			}

		</script>
	</head>
	
	<body>
		<form method="get">
			<select id="numero">
				<option value="1">1</option>
			  	<option value="2">2</option>
			  	<option value="3">3</option>
			</select>
		</form>
		<button onClick="Coger('datos/provincias.xml')">Coge un documento</button>
		<table >
			<tr>
			<!--El campo con id=resultado se sustituirá por causa de que ese id está en la función coger-->
				<td><span id="resultado"></span></td>
			</tr>
		</table>
	</body>

Y el código XML (lo he simplificado bastante):

Código XML:

Ver original<?xml version="1.0" encoding="iso-8859-1"?>
    <Provincias>
        <Ciudad id='1'>Almeria</Ciudad>
        <Ciudad id='2'>Cadiz</Ciudad>
        <Ciudad id='3'>Cordoba</Ciudad>
    </Provincias>

Gracias por anticipado

caricatos · #2 (**permalink**) 15/02/2013, 17:09

Hola:

En vez de responseText deberías recibir los datos con responseXML, luego recorrer el array de ciudades (getElementsByTagName("Ciudad")), y consultar el id...

Inténtalo y nos cuentas los progresos...

Saludos

Reedyseth · #3 (**permalink**) 15/02/2013, 18:03

Caricatos tiene razon, tienes que recorrer el arreglo obtenido. No se cuanto tiempo tienes con tu frustracion pero aqui te corregi tu codigo y le agregue lo que necesitas para hacerlo funcionar, cabe mencionar que es muy importante que veas el codigo para que sepas como funciona y puedas usarlo o mejorarlo posterior mente.

Tambien te falto algo mas en tu codigo, no le decias cual elemento del combo box querias, pero lo pongo para que veas como se hace:

Código Javascript:

Ver originalvar peticion01 = null;
//Creamos la variable
//Para Internet Explorer creamos un objeto ActiveX
if (navigator.appName == "Microsoft Internet Explorer") {
    peticion01 = new ActiveXObject("Microsoft.XMLHTTP");
} else {
    peticion01 = new XMLHttpRequest;
}
function Coger(url) {//Función coger, en esta caso le entra una dirección relativa al documento actual.
    if (peticion01) {//Si tenemos el objeto peticion01
        peticion01.open('GET', url, false);
        //Abrimos la url, false=forma síncrona
        peticion01.send(null);
        //No le enviamos datos al servidor.
 
        // obtenemos el valor seleccionado de nuestro comboBox
        var selectMenu = document.getElementById("numero");
        var selectedValue = selectMenu.options[selectMenu.selectedIndex].value;
 
        // Obtenemos nuestro xml
        var xmlData = peticion01.responseXML.getElementsByTagName("Ciudad");
        for (var i = 0; i < xmlData.length; i++) {
            if (xmlData[i].attributes.id.nodeValue == selectedValue) {
                console.info("Se encontro el id seleccionado");
                //Escribimos la respuesta en el campo con ID=resultado
                document.getElementById('resultado').innerHTML = xmlData[i].textContent;
                break
            }
        };
 
    }
}

Caricatos, como la vez, los dejo que se esfuerzen mas al obtener su codigo o les ayudo ? cual es tu opinion al respecto?

caricatos · #4 (**permalink**) 16/02/2013, 00:58

Hola:

He visto que has creado tu firma

Cita:

Iniciado por Reedyseth

...
Caricatos, como la vez, los dejo que se esfuerzen mas al obtener su codigo o les ayudo ? cual es tu opinion al respecto?

Como usuario (no moderador), prefiero participar considerando que los foros son de "debate" o "discusión" (amable, por supuesto)... es más, a veces (muchas veces), lo que se considera "solución" es (muy) mejorable, así que en principio me gusta hacer razonamientos teóricos, dejando de lado los códigos... luego habrá que ver como evoluciona... simplemente es mi idea de como participar.

Saludos

Reedyseth · #5 (**permalink**) 16/02/2013, 01:04

Pues si tienes razón, para eso se crean los temas, igual y puede salir otra persona con un código diferente y nos puede ayudar a todos, saludos. !!

urskeks · #6 (**permalink**) 17/02/2013, 10:54

Muchísimas gracias a todos!!! He conseguido solucionarlo... cuando he visto la solución me sentí muy tonta... siempre creo que la solución es más complicada de lo que realmente es.
Reedyseth, entiendo la duda sobre poner o no el código... entiendo que no me tenéis porqué hacer el trabajo, por eso puse un código simplificado, para ahora comerme bien la cabeza para adaptarlo al real!!!!!
Muchas gracias de nuevo, sois geniales.

Reedyseth · #7 (**permalink**) 17/02/2013, 11:35

Cuando un usuario responde si le sirvio no nuestra respuesta es cuando nos damos por bien servidos, que bueno que te sirvio, saludos !!!