Auto rellenar formulario con ajax.

[Alexhg42]

Estoy haciendo un punto de venta con tecnologias web. Hoy mismo empece a usar Ajax.
ya hice un script para subir el producto comprado a la bd pero lo que ahora quiero es que, cuando el vendedor empiece a escribir el id del producto, los demás campos se vayan auto rellenando dependiendo si encuentra el producto. la funcion se ejecuta con un bind cuando se pega el id, se escribe (letra por letra) o cambia (.change())

asi se ve la interfaz para que me entiendan.



El id es el que se va a ingresar y los que se autorellenaran seran nombre producto, precio, descripcion y stock (que no es en si un input)

este es el codigo de jquery que ocupo.

Código:

$("#qrcode").bind("change paste keyup",change());
function change(){
	var elid = $("#idproducto").val();
	//alert("cambio!");
	var idGo = {'elid' : elid };
	$.ajax({
	    data:  idGo,
	    url:   'php/datosproducto.php',
	    type:  'post',
	    beforeSend: function () {
	        $("#resultado").html("Procesando, espere por favor...");
	    },
		success:  function () {
		    $("#nombreproducto").val(phpnombre_producto);
		    $("#precioproducto").val(phpprecio_producto);
		    $("#descripcionproducto").val(phpdescripcion_producto);
		    $("#stockproducto").html(phpstock_producto);
		}
	});
}

y el php es asi (no hago llamadas a la base de datos porque por ahora es una mera prueba:

Código PHP:

  <?php
$idGo = $_POST["elid"];
echo '<script>
    phpnombre_producto = "el nombre del productini";
    phpprecio_producto = 500;
    phpdescripcion_producto = "Esta es la descripcion del '.$idGo.'";
    phpstock_producto = 10;
    </script>';
?>   

En si lo que quiero es pasar variables de php a jquery, cambiaria el texto que puse por las variables. pero esto solo me sale el error que no estan definidas las variables php[...]_producto. por lo que entiendo que no las pasa. cual creen que seria el problema?

[Alexis88]

Pienso que sería mejor que mientras escribes el código del producto, aparezca una lista desplegable debajo de ese campo de texto con todas las coincidencias existentes, luego, seleccionas una de ella y se completan los campos.

Hace ya algunos meses hice un pequeño buscador similar al de Facebook que creo que te puede ser de mucha ayuda. Puedes pasar a verlo aquí.

Saludos

[Alexhg42]

Gracias por responder Alexis88.
Para quien tenga el mismo problema o quiera hacer lo mismo que yo, descubrí una manera de hacerlo, lo mas seguro no es la correcta, pero en internet no pude encontrar ni una forma de hacerlo, asi que me puse a programar lo que creí que podría funcionar. Aquí se los comparto.

Este es el codigo Jquery usando ajax

Código:

$("#qrcode").bind("change paste keypress",function(){change()});
function change(){
	//Codigo jquery con el metodo de prograacion ajax donde, por medio de este, se pasa el id del producto hacia php y este se encarga de buscar una coincidencia en la base de datos, devolviendo hacia el mismo php una serie de variables con las caracteristicas del producto.
	
	//var phpnombre_producto, phpprecio_producto, phpdescripcion_producto, phpstock_producto;
	var elid = $("#qrcode").val();
	//alert($("#qrcode").val());
	//alert("cambio!");
	var idGo = {'elid' : elid };
	$.ajax({
	    data:  idGo,
	    url:   'php/datosproducto.php',
	    type:  'post',
	    beforeSend: function () {
	        //$("#resultado").html("Procesando, espere por favor...");
	    },
		success:  function (response) {
			//Aqui, jquery recibe una cadena de texto generada desde php con las variables generadas a partir de los datos recibidos de la base de datos y este script de respuesta se encarga de convertir esa cadena, desmenusandola a detalle, en variables aparte segun la gerarquia de contenido anteriormente programada.
			var nombre = "";
			var precio = "";
			var descripcion = "";
			var stock = "";
			var a = 1;
			var b = 0;
			var c = 0;
			var d = 0;
			var tamano = response.length-1;
		    for(a; a < response.length; a++){
		    	if(response[a] != "[" || response[a] != "]"){
		    		nombre = "" + nombre + response[a] + "";
		    	}
		    	if (response[a] == "]") {
		    		b = a+2;
		    		a = response.length;
		    	};
		    }
		    for(b; b < response.length; b++){
		    	if(response[b] != "[" || response[b] != "]"){
		    		precio = "" + precio + response[b] + "";
		    	}
		    	if (response[b] == "]") {
		    		c = b+2;
		    		b = response.length;
		    	};
		    }
		    for(c; c < response.length; c++){
		    	if(response[c] != "[" || response[c] != "]"){
		    		descripcion = "" + descripcion + response[c] + "";
		    	}
		    	if (response[c] == "]") {
		    		d = c+2;
		    		c = response.length;
		    	};
		    }
		    for(d; d < response.length; d++){
		    	if(response[d] != "[" || response[d] != "]"){
		    		stock = "" + stock + response[d] + "";
		    	}
		    }
		    //elimina los corchetes al final de cada una de las cadenas.
		    nombre = nombre.replace("]", "");
		    precio = precio.replace("]", "");
		    descripcion = descripcion.replace("]", "");
		    stock = stock.replace("]", "");
		    $("#nombreproducto").val(nombre);
		    $("#precioproducto").val(precio);
		    $("#descripcionproducto").val(descripcion);
		    $("#stockproducto").html(stock);
		    $("#cantidadproducto").val(1)
		}
	});
}

Este es el codigo PHP:

Código PHP:

  <?php
$idGo = $_POST["elid"];
echo "[Productini][25.75][esta es la descripcion hecha devuelta con ajax][40]";
?>   

Básicamente lo que hago es, con ajax, pasar el id del producto a php, con php buscarlo en la base de datos (en este caso por ser solo un ejemplo, entre los corchetes, puse valores cualquiera -entre los corchetes deberían ir las variables php donde bajo los datos de la bd con el orden [nombre][precio][descripción][stock]-). Después php los vuelve un array y los envía en un echo, el cual jquery toma en succes y realiza la lectura de el array y por medio de un for' recorro la cadena (que en si es un array) eliminando los corchetes y poniendo el respectivo valor en cada variable: (es el primer código que puse).

Sal