Como cambiar los valores de 3 campos en función de lo que se selecciona en un select

[rbczgz]

Hola amig@s!

Hacía mucho tiempo que no posteaba nada, pero ahora necesito ayuda con una cosa muy sencilla para los expertos pero que para mi es un mundo porque no tengo ni idea de AJAX, es lo siguiente:

Basándome en un post que he encontrado estoy intentando completar el valor de 3 campos dependiendo de lo que se elija en el select, pero me carga todos los datos en dos de los 3 campos y ninguno en el tercero.

Copio aquí los códigos:

ajax.js

Código:

<!--
// devuelve un objeto XMLHttpRequest para varios navegadores
function AJAX() {
	try {xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");} catch (e) {
		try {xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");} catch (ee) {xmlhttp = false;}
	}
	if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
		try {xmlhttp = new XMLHttpRequest();} catch (e) {xmlhttp = false;}
	}
	if (!xmlhttp && window.createRequest) {
		try {xmlhttp = window.createRequest();} catch (e) {xmlhttp = false;}
	}
	if (!xmlhttp) {
		alert("Tu navegador no soporta el objecto XMLHttpRequest.");
	}
	return xmlhttp;
}

var alCambiarLaLista = function(item1,item2,item3) {
   // obtenemos un objeto XMLHttpRequest en la variable ajax	
   var ajax = new AJAX();
   // Construimos la petición a ajax.php con el valor seleccionado del select como parámetro
   ajax.open("GET","ajax.php?palabra=" + item1.value,true);
   // Cambió el estado de la petición
   ajax.onreadystatechange = function() {
      // Si completada la petición
      if (ajax.readyState == 4) {
         // Si la respuesta es 200 OK
         if (ajax.status == 200) {
            document.getElementById("NroItem").value = ajax.responseText;
            document.getElementById("PrecioItem").value = ajax.responseText;
            document.getElementById("NombreItem").value = ajax.responseText;
         }
      }
   }
   // Ejecutamos la petición
   ajax.send(null);
}
//-->

ajax.php

Código:

<?
    if ($_GET['palabra'] == "Anuncio Simple") {
    	echo $NroItem = 1001;
    	echo $PrecioItem = 800;
    	}
    if ($_GET['palabra'] == "Anuncio Doble") {
    	echo $NroItem = 1002;
    	echo $PrecioItem = 1600;
    	}
    if ($_GET['palabra'] == "Anuncio Triple") {
    	echo $NroItem = 1003;
    	echo $PrecioItem = 2400;
    	}
    if ($_GET['palabra'] == "Anuncio Cuadruple") {
    	echo $NroItem = 1004;
    	echo $PrecioItem = 3200;
    	}
    if ($_GET['palabra'] == "Anuncio Quintuple") {
    	echo $NroItem = 1005;
    	echo $PrecioItem = 4000;
    	}
 
?>

y por último, la que debería mostrar todo, test.php

Código:

<script type="text/javascript" src="ajax.js"></script>
<form>
<select id="NombreItem" onchange="alCambiarLaLista(this)">
<option value=''><- Selecciona-></option>
<option value='Anuncio Simple'>Anuncio Simple</option>
<option value='Anuncio Doble'>Anuncio Doble</option>
<option value='Anuncio Triple'>Anuncio Triple</option>
<option value='Anuncio Cuadruple'>Anuncio Cuadruple</option>
<option value='Anuncio Quintuple'>Anuncio Quintuple</option>
</select>
<input type='text' id='NroItem' size='5' name='NroItem'>
<input type='text' id='NombreItem' size='10' name='NombreItem'>
<input type='text' id='PrecioItem' size='5' name='PrecioItem'>
<br>
<input type='submit' name='submit' value='Comprar'>
</form>

A ver si algún alma caritativa me puede echar una mano, más que nada en explicarme por qué no me funciona.

Muchas gracias.

[rbczgz]

¿Nadie me puede echar un cable? Estoy intentando aprender algo de AJAX y pensé que con algo tan sencillo podría, pero veo que solo no puedo

[tavomestra22]

pero asi no te da la misma respuesta en todos los campos.....

yo tengo algo parecido mira este post

yo lo hice asi..... soy navato.... y nose si hay otra forma

#
if(ajax.status==200){
#
respuesta=ajax.responseText;
#
datos = respuesta.split(",");
#
cnombre.value=(datos[0]);
#
capellido.value=(datos[1]);

http://www.forosdelweb.com/f18/mostrar-datos-input-851683/

[chicohot20]

Mi metodo es un poco diferente:

Código HTML:

<script>
<!--
// devuelve un objeto XMLHttpRequest para varios navegadores
function AJAX() {
    try {xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");} catch (e) {
        try {xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");} catch (ee) {xmlhttp = false;}
    }
    if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
        try {xmlhttp = new XMLHttpRequest();} catch (e) {xmlhttp = false;}
    }
    if (!xmlhttp && window.createRequest) {
        try {xmlhttp = window.createRequest();} catch (e) {xmlhttp = false;}
    }
    if (!xmlhttp) {
        alert("Tu navegador no soporta el objecto XMLHttpRequest.");
    }
    return xmlhttp;
}
 
var alCambiarLaLista = function(item1,item2,item3) {
   // obtenemos un objeto XMLHttpRequest en la variable ajax    
   var ajax = new AJAX();
   // Construimos la petición a ajax.php con el valor seleccionado del select como parámetro
   ajax.open("GET","ajax.php?palabra=" + item1.value,true);
   // Cambió el estado de la petición
   ajax.onreadystatechange = function() {
      // Si completada la petición
      if (ajax.readyState == 4) {
         // Si la respuesta es 200 OK
         if (ajax.status == 200) {
            document.getElementById("result").innerHTML = ajax.responseText;
            document.getElementById("NroItem").value = document.getElementById("nro").innerHTML;
            document.getElementById("NombreItem").value = document.getElementById("nombre").innerHTML;
            document.getElementById("PrecioItem").value = document.getElementById("precio").innerHTML;
         }
      }
   }
   // Ejecutamos la petición
   ajax.send(null);
}
//-->
</script>
<div id="result"></div>
<form>
<select onchange="alCambiarLaLista(this)">
<option value=''><- Selecciona-></option>
<option value='Anuncio Simple'>Anuncio Simple</option>
<option value='Anuncio Doble'>Anuncio Doble</option>
<option value='Anuncio Triple'>Anuncio Triple</option>
<option value='Anuncio Cuadruple'>Anuncio Cuadruple</option>
<option value='Anuncio Quintuple'>Anuncio Quintuple</option>
</select>
<input type='text' id='NroItem' size='20' name='NroItem'>
<input type='text' id='NombreItem' size='20' name='NombreItem'>
<input type='text' id='PrecioItem' size='20' name='PrecioItem'>
<br>
<input type='submit' name='submit' value='Comprar'>
</form>
 

ajax.php

Código PHP:

<?
$nro="10";
$nombre="Nombre producto";
$precio="20.00";
    if ($_GET['palabra'] == "Anuncio Simple") {
        echo "<span id='nro'>$nro</span><span id='nombre'>$nombre</span><span id='precio'>$precio</span>";
        }
    if ($_GET['palabra'] == "Anuncio Doble") {
        $nro="102";
$nombre="Nombre2 producto";
$precio="202.00";
        echo "<span id='nro'>$nro</span><span id='nombre'>$nombre</span><span id='precio'>$precio</span>";
        }
    if ($_GET['palabra'] == "Anuncio Triple") {
        $nro="103";
$nombre="Nombre3 producto";
$precio="203.00";
        echo "<span id='nro'>$nro</span><span id='nombre'>$nombre</span><span id='precio'>$precio</span>";
        }
    if ($_GET['palabra'] == "Anuncio Cuadruple") {
        $nro="104";
$nombre="Nombre4 producto";
$precio="204.00";
        echo "<span id='nro'>$nro</span><span id='nombre'>$nombre</span><span id='precio'>$precio</span>";
        }
    if ($_GET['palabra'] == "Anuncio Quintuple") {
        $nro="105";
$nombre="Nombre5 producto";
$precio="205.00";
        echo "<span id='nro'>$nro</span><span id='nombre'>$nombre</span><span id='precio'>$precio</span>";
        }
 
?>
 

[rbczgz]

Muchas gracias, chicohot20, es justo lo que necesitaba para enterarme un poco de cómo va esto.