Usando ajax para cargar un campo(No combobox)

[Highlander]

Buenas he estado peleando modificando este codigo y logre hacer que me funcionara pero tiene unos detalles que no he logrado solucionar:

1- El campo donde recibo mi dato es una lista y quiero cambiarlo a que sea un campo de texto simple ya que solo recibo un dato.

2- No me resulta enviar mas de 1 dato, por ej: envio el ID via ajax, para devolver la descripcion del articulo, pero si trato de enviar ademas su precio no me carga el dato en otro campo.

salida.html

Código:

<span id="espera"></span>
<select name="desc_art" class="style3" id="desc_art"></select>

consulta.php

Código:

<?php
$codigo_art=$_REQUEST['cod'];

$link = mysql_connect('localhost','root');
$db_selected = mysql_select_db('SCI', $link);
			
$consulta = "SELECT DESC_ART, VALOR_ART FROM articulo WHERE CODIGO_ART = '$codigo_art'"; 
$resultado = mysql_query($consulta,$link);
$datos = mysql_fetch_array($resultado);
$materias[]=$datos["DESC_ART"];
$materias2[]=$datos["VALOR_ART"];
mysql_close($link); 

$xml="<?xml version=\"1.0\"?>\n";
$xml.="<materias>\n";
for($f=0;$f<count($materias);$f++)
{
  $xml.="<materia>".$materias[$f]."</materia>\n";
}
$xml.="</materias>\n";
echo $xml;
header('Content-Type: text/xml');

?>

funciones.js

Código:

addEvent(window,'load',inicializarEventos,false);

function inicializarEventos()
{
  var select1=document.getElementById('codigo_art');
  addEvent(select1,'change',mostrarMaterias,false);
}

var conexion1;
function mostrarMaterias(e) 
{
  var codigo=document.getElementById('codigo_art').value;
  if (codigo!=0)
  {
    conexion1=crearXMLHttpRequest();
    conexion1.onreadystatechange = procesarEventos;
    conexion1.open('GET','consulta.php?cod='+codigo, true);
    conexion1.send(null);
  }
  else
  {
    var select2=document.getElementById('desc_art');
    select2.options.length=0;
  }
}

function procesarEventos()
{
  if(conexion1.readyState == 4)
  {
    var d=document.getElementById('espera');
    d.innerHTML = '';
    var xml = conexion1.responseXML;
    var pals=xml.getElementsByTagName('materia');
    var select2=document.getElementById('desc_art');
    select2.options.length=0;
    for(f=0;f<pals.length;f++)
    {
      var op=document.createElement('option');
      var texto=document.createTextNode(pals[f].firstChild.nodeValue);
      op.appendChild(texto);
      select2.appendChild(op);
    } 
	
	//
	
	//
  } 
  else 
  {
    var d=document.getElementById('espera');
    d.innerHTML = '<img src="../cargando.gif">';
  }
}


//***************************************
//Funciones comunes a todos los problemas
//***************************************
function addEvent(elemento,nomevento,funcion,captura)
{
  if (elemento.attachEvent)
  {
    elemento.attachEvent('on'+nomevento,funcion);
    return true;
  }
  else  
    if (elemento.addEventListener)
    {
      elemento.addEventListener(nomevento,funcion,captura);
      return true;
    }
    else
      return false;
}

function crearXMLHttpRequest() 
{
  var xmlHttp=null;
  if (window.ActiveXObject) 
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  else 
    if (window.XMLHttpRequest) 
      xmlHttp = new XMLHttpRequest();
  return xmlHttp;
}

[caricatos]

Hola:

Lo del select, es fácil cambiarlo...
<input type="text" name="desc_art" class="style3" id="desc_art">

Lo de la clase, tu sabrás si sirve..., y en la recepción no necesitarás un bucle for...

document.getElementById('desc_art').value = pals[f].firstChild.nodeValue;

Y para enviar más de un valor, debes fabricar la url como cualquier url con parámetros:
url = "index.php?var1=" + escape(var1) + "&var2=" + escape(var2);

Saludos

[Highlander]

Gracias ya habia tratado de modificar el tipo del input pero dejo de recibir el dato, asumo que tengo que modificar mas cosas y la verdad no entiendo mucho de ajax.

Segun mi aqui envio el dato que voy mostrar en este caso un vector probe eliminando el ciclo y no llega el dato.

Estoy buscando algun ejemplo documentando pq la verdad estoy dando bote.

Código:

$xml="<?xml version=\"1.0\"?>\n";
$xml.="<materias>\n";
for($f=0;$f<count($materias);$f++)
{
  $xml.="<materia>".$materias[$f]."</materia>\n";
}
$xml.="</materias>\n";
echo $xml;
header('Content-Type: text/xml');

[caricatos]

Hola:

Según parece $materias está decladaro como un array, así que al menos deberías indicar que es el primer elemento...

$xml.="<materia>".$materias[0]."</materia>\n"; // sin bucle

O declarar la variable sin el juego de corchetes.

Saludos

[Highlander]

Hola de nuevo, modifique esto y me esta enviado los datos:

Código:

$xml="<?xml version=\"1.0\"?>\n";
$xml.="<materias>\n";
$xml.="<materia>".$materias."</materia>\n";
$xml.="</materias>\n";
echo $xml;
header('Content-Type: text/xml');

Segun firebug esto envia:

<?xml version="1.0"?>
<materias>
<materia>A1-c-abrazadera B. Estab. Porter 98-2003 1,75t.</materia>
</materias>

Pero el campo no se actualiza luego de haberlo convertido a tipo texto, me tinca que el problema esta en funciones.js que no entiendo bien que hace, en esta parte:

Código:

function procesarEventos()
{
  if(conexion1.readyState == 4)
  {
   // var d=document.getElementById('espera');
   // d.innerHTML = '';
    var xml = conexion1.responseXML;
    var pals=xml.getElementsByTagName('materia');
    var select2=document.getElementById('desc_art');
    //select2.options.length=0;
    for(f=0;f<pals.length;f++)
    {
      var op=document.createElement('option');
      var texto=document.createTextNode(pals[f].firstChild.nodeValue);
      op.appendChild(texto);
      select2.appendChild(op);
    } 
	
	//
	
	//
  } 
  //else 
  // {
   // var d=document.getElementById('espera');
   // d.innerHTML = '<img src="../cargando.gif">';
  //}
}

[caricatos]

Hola:

La verdad es que mirando el código, no he encontrado errores, pero ¿Te has fijado en la consola de errores del navegador...? Si no hay errores, te recomiendo que pongas alertas para el chequeo... a veces se nos escapan cosas muy sencillas...

Saludos

[Highlander]

El error es que habian algunas sentencias que eran para enviar varios datos, al eliminar el envio del vector se podria el error.

Encontre un codigo que hace justo lo que nesecito y de manera mas simple, me permite actualizar varios campos a la vez basados en el valor de uno solo (EJ: ID)
le hice una pequeña modificación para que se ejecute en el evento onChange.

Por si alguien le sirve:

ej1.php

Código:

<html>
<head>
<script language="javascript" type="text/javascript">
function nuevoAjax()
{ 
    var xmlhttp=false; 
    try 
    { 
        xmlhttp=new ActiveXObject("Msxml2.XMLHTTP"); 
    }
    catch(e)
    { 
        try
        { 
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
        } 
        catch(E) { xmlhttp=false; }
    }
    if (!xmlhttp && typeof XMLHttpRequest!='undefined') { xmlhttp=new XMLHttpRequest(); } 

    return xmlhttp; 
}

function traerDatos()
{
    var cod=document.getElementById("cod").value;
    var campo1=document.getElementById("c1");
    var campo2=document.getElementById("c2");
        
    var ajax=nuevoAjax();
    ajax.open("POST", "ej2.php", true);
    ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    ajax.send("v="+cod);
            
    ajax.onreadystatechange=function()
    {
        if (ajax.readyState==4)
        {
            var respuesta=ajax.responseXML;// Rescata el contenido del archivo XML retornado del servidor:
            campo1.value=respuesta.getElementsByTagName("nombre")[0].childNodes[0].data;
            campo2.value=respuesta.getElementsByTagName("apellido")[0].childNodes[0].data;
        }
    }
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Ejemplo</title>
</head>
<body>
<input type="text" id="cod" onChange="traerDatos(this.form)"> Codigo <br><br>
<input type="text" id="c1"> Nombre<br><br>
<input type="text" id="c2"> Apellido
</body>
</html>

ej2.php

Código:

<?php
$v=$_POST["v"];

$conexion=mysql_connect("localhost", "root", "");
mysql_select_db("ajax", $conexion);

$resultado=mysql_query("SELECT nombre, apellido FROM ejemplo WHERE id='$v'");
$registro=mysql_fetch_row($resultado);

$xml="<?xml version='1.0' encoding='ISO-8859-1'?>";
$xml.="<datos>";
$xml.="<nombre><![CDATA[$registro[0]]]></nombre>";
$xml.="<apellido><![CDATA[$registro[1]]]></apellido>";
$xml.="</datos>";
header("Content-type: text/xml");
echo $xml;
?>