Mostrar datos en una tabla desde un select PHP + MySQL + AJAX

Lo que se hará es que el usuario al seleccionar una opción de la lista desplegable se muestre en una tabla información detallada de la opción escogida. Con AJAX se elimina el uso del botón.

conexion.php

< ?php
function conexion(){
$con = mysql_connect("localhost","root","");
if (!$con){
die('Could not connect: ' . mysql_error());

 }
mysql_select_db("database", $con);
return($con);
}
?>

En el archivo principal, está la función JavaScript mostrarInfo() que se ejecuta cuando el usuario hace click en una opcion del select. Recibe como parámetro el codigo de un registro, para que a través del método POST el archivo proceso.php haga la consulta a la base de datos. Los registros cargados en select estan de forma estática (sin MySQL).

index.php

< !DOCTYPE html>
< html>
< head>

< script>

function mostrarInfo(cod){

if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("datos").innerHTML=xmlhttp.responseText;
}else{
document.getElementById("datos").innerHTML='Cargando...';
}
}
xmlhttp.open("POST","proceso.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("cod_banda="+cod);

}

< /script>

< /head>
< body>

< form>

< select onchange="mostrarInfo(this.value)">
< option value="">Seleccione</option>
< option value="1">The Speakers</option>
< option value="2">The Doors</option>
< option value="3">The Rolling Stones</option>
< option value="4">Los Shakers</option>
< /select>

< /form>

< div id="datos"></div>

< /body>
< /html>

El codigo que nos envían desde index.php se almacena en la variable cod_banda. Este archivo lo que hace es capturarla y hacer la query a la base de datos. La información se muestra en una tabla y es lo que se va a visualizar en la página principal sin recargar la página entera.

proceso.php

< ?php

include 'conexion.php';

$con=conexion();

$res=mysql_query("select * from grupo_artista where codigo='".$_POST[cod_banda]."'",$con);

?>

< table border="1">

< tr>
< th>Codigo</th>
< th>Banda</th>
< th>Genero</th>
< th>Origen</th>
< /tr>

< ?php while($fila=mysql_fetch_array($res)){ ?>

< tr>
< td><?php echo $fila[codigo]; ?></td>
< td><?php echo $fila[nombre]; ?></td>
< td><?php echo $fila[genero]; ?></td>
< td><?php echo $fila[pais]; ?></td>
< /tr>

< ?php } ?>

< /table>

< ?php mysql_close($con); ?>