Cargue una selección de otra selección PHP + AJAX + MySQL

Para cargar o completar una selección con datos de la base de datos de otra selección, usamos AJAX y el evento onchange de JavaScript . El siguiente ejemplo consiste en una base de datos compuesta por dos tablas, una llamada continente y otro país. Cuando se selecciona un continente, aparecen algunos países que pertenecen a ese continente, para lo cual las tablas deben estar necesariamente relacionadas.

El ejemplo se divide en cuatro archivos:

El archivo de conexión para conectarse a la base de datos.

conexion.php

conexión de función () {

$ con = mysql_connect ("localhost", "root", "");

if (! $ Con) {

die (& # 39; No se pudo conectar: ​​& # 39 ;. mysql_error ());
}

mysql_select_db ("database", $ con);

devolución ($ con);

}

?>

Este archivo es la vista de usuario. Contiene la primera selección donde cargamos los continentes almacenados en la base de datos. Tiene como atributo el evento onchange de JavaScript que ejecuta la función ajax load () cada vez que se hace clic en una opción (continente).

index.php

incluye & # 39; connection.php & # 39 ;;
?>

[196590003] [194590003] HTML – AXCX. ]]

<? Php

$ with = connection ();
$ res = mysql_query ("seleccionar * de continente", $ con);

?>

<select id = "cont" onchange = "load (this.value)" >

Select

<? Php

while ($ row = mysql_fetch_array ($ res)) {[19659003]?>

<option value = ""> [1945900028] [194590003] ] [196590003]]

El archivo ajax.js es un archivo javascript que contiene la función load (), esto captura el código del seleccionado. Continente y se envía al archivo proc.php a través de la variable y con el método de envío para procesarlo.

ajax.js

función de carga (str)
{
var xmlhttp;

if (window.XMLHttpRequest)
{// código para IE7 +, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest ();
}
else
{// código para IE6, IE5
xmlhttp = new ActiveXObject ("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function ()
{
if (xmlhttp.readyState = = 4 && xmlhttp.status == 200)
{
document.get ElementBiI " "). InnerHTML = xmlhttp.responseText;
}
}
xmlhttp.open ("POST", "proc.php", true);
xmlhttp.setRequestHeader ("Content-type", "application / x-www-form-urlencoded");
xmlhttp.send (" q ] =" + str);
}

Finalmente, este archivo captura el código del continente para realizar una consulta a la base de datos y mostrar en otra parte los países del continente seleccionado. El resultado se muestra en el div con id igual a myDiv ubicado en el archivo index.php

proc.js

incluye & # 39; connection.php & # 39 ;;

$ q = $ _ POST [‘q’];
$ con = conexión ();

$ res = mysql_query ("seleccionar * del país donde cod_cont =". $ Q. "", $ With);

?>