Ver Mensaje Individual
  #6 (permalink)  
Antiguo 15/07/2009, 16:26
Avatar de djaevi
djaevi
 
Fecha de Ingreso: marzo-2007
Ubicación: Moreno, Buenos Aires
Mensajes: 400
Antigüedad: 19 años, 7 meses
Puntos: 47
Respuesta: imprimir resultado de una consulta a partir de un combobox seleccionado

No es algo dificil de hacer con ajax yo estuve haciendo algo parecido te lo adapte un poco mira este es el codigo javascript...
Código PHP:
var objetoXhr = Xajax();

var 
READY_STATE_UNINITIALIZED = 0;
var 
READY_STATE_LOADING = 1;
var 
READY_STATE_LOADED = 2;
var 
READY_STATE_INTERACTING = 3;
var 
READY_STATE_COMPLETE = 4;
var 
READY_STATUS = 200;

function 
Xajax() {
    if (
window.XMLHttpRequest) {
        return new 
XMLHttpRequest();
        }else if(
window.ActiveXObject) {
        return new 
ActiveXObject("Microsoft.XMLHTTP");
        }
    }
    
function 
cargarAjax(url,metodo,funcion,parametros,objetoAjax) {
    if (
objetoAjax) {
        
objetoAjax.onreadystatechange = funcion;
        
objetoAjax.open(metodo,url,true);
        
objetoAjax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        
objetoAjax.send(parametros);
        }
    }

// aqui realizo la llamada y recepcion de datos con ajax y lo inserto
// en el div llenarDatos del codigo html...
    
function ajaxProduct() {
    var 
texto = "";
    var 
div = document.getElementById('llenarDatos');
        if (
objetoXhr.readyState == READY_STATE_COMPLETE) {
            if (
objetoXhr.status == READY_STATUS) {
                var 
JSON = eval("("+objetoXhr.responseText+")");
                
texto += "<p>Codigo=" + JSON.Codigo + "</p>";
                
texto += "<p>Producto=" + JSON.Producto + "</p>";
                
texto += "<p>Marca=" + JSON.Marca + "</p>";
                
div.innerHTML = texto;
            }
        }
}
    
function 
llamarDatos() {
    var 
elSelect = document.getElementById('productosSelect');
    var 
codigo = elSelect.options[elSelect.selectedIndex].value;
    var 
query = "codigo="+codigo+"&nocache="+Math.random();
    
cargarAjax("productos.php","POST",ajaxProduct,query,objetoXhr);
}

window.onload = function() {
    
document.getElementById('boton').onclick = llamarDatos;
} 
y el codigo html...

Código HTML:
<select id="productosSelect">
<option value=1>Televisor</option>
<option value=2>Computadora</option>
<option value=3>Mp3</option>
</select>
<input type="button" id="boton" value="Ver Datos"/>
<div id="llenarDatos"></div> 
Como veras hice un codigo html para dar un ejemplo donde puse 3 opciones al select cada value se corresponde con el codigo de un producto en la base de datos, ahora vamos al archivo productos.php...

Código PHP:
<?php
$codigo 
= $_POST['codigo'];
$link = mysql_connect("localhost","root");
$bd = "Ajax";
$elArray = array();
mysql_select_db($bd,$link);
$result = mysql_query("SELECT * FROM productos WHERE Codigo = '$codigo'");
while (
$dato = mysql_fetch_row($result)) {
        
$codigo = $dato[0];
        
$producto = $dato[1];
        
$marca = $dato[2];
    }
echo 
"{Codigo:'".$codigo."', Producto:'".$producto. "', Marca:'" . $marca . "'}";
?>
aca como ves es una simple consulta a la base donde lo importante es que recibo el codigo que manda javascript mediante la variable $_POST['codigo']; y el formato de salida que le doy al echo, es el formato de un objeto JSON de javascript donde el primer parametro va a ser una propiedad del objeto JSON definido en la funcion ajaxProduct y el 2do es el valor...

Sino entendes algo avisame es bastante largo como para comentarlo todo...

Salu2 y suerte :D

Última edición por djaevi; 16/07/2009 a las 06:39