Foros del web, para los que viven de bits

Hola!! tengo que programar un buscador para un portal y tengo dos combos, uno que muestre las provincias y otro que en funcion de la provicia escogida muestre las localidades correspondientes. Estos datos se cargaran de una base de datos MySQL.
Me gustaria que el 2º combo se cargase cuando el usuario escogiese una opcion del 1º. Creo que es con javascript y AJAX pero no tengo ni idea de este lenguaje.

Ejemplo: cuando en el 1er combo se seleccione Madrid kiero que en ese momento se cargue el segundo combo con las localidades de Madrid.

Si pudieseis echarme una mano... Muchas gracias.

Felicidades por estos foros!! me encanta actualizarme en conocimientos y estos me resuelven algunas dudas.

Hola....

Obviamente y como podras imaginartelo la respuesta es AJAX

yo lo e hecho con 3 listas dependientes en un Site.

Puedes verlo aqui... http://www.gtsneumaticos.com.ar

Bien ahora te dire como hacerlo.

Primero de todo tus dos combos deben tener id

por ejemplo utilizaré id="cbx_primero" para el 1er combo y id="cbx_segundo" para el 2do combo.

Segundo sobre el onChange del 1er combo llama a la funcion javascript onChange_primer_combo()

<script type="text/javascript" language="JavaScript1.2">

var url_carga_segundo_combo = "accion_carga_segundo_combo.php?id=";

var http = getHTTPObject(); // We create the HTTP Object

//---------------------------------------------------
//-- Genera xmlHttpRequest
//---------------------------------------------------

function getHTTPObject() {
var xmlhttp;
/*@cc_on
@if (@_jscript_version >= 5)
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
@else
xmlhttp = false;
@end @*/
if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
try {
xmlhttp = new XMLHttpRequest();
} catch (e) {
xmlhttp = false;
}
}
return xmlhttp;
}

//------------------------------ on change del 1er combo

function onChange_primer_combo() {

// obtenemos el id seleccionado del 1er combo
var selObj = document.getElementById('cbx_primero');
var selIndex = selObj.selectedIndex;
var v_id = selObj.options[selIndex].value;

// blanquemos el 2do combo
document.getElementById('cbx_segundo').options.len gth = 0;

http.open("GET", url_carga_segundo_combo + escape(v_id) , true);

http.onreadystatechange = handleHttpResponse_onChange_primer_combo;

http.send(null);



}

// y por ultimo publicamos los resultados

//*---------------------------------------------------------------
//-- Publica Combo PERFIL segun seleccion Combo ANCHOS - PASO II
//----------------------------------------------------------------

function handleHttpResponse_onChange_Combo_Ancho() {



if (http.readyState == 4) {

var i;

var total = http.responseXML.getElementsByTagName('LINEA').len gth;



results = http.responseText.split(",");




for(i=0;i<total;i++){

document.getElementById('cbx_segundol').options[i+1]= new Option( http.responseXML.getElementsByTagName('COL1')[i].firstChild.data ,http.responseXML.getElementsByTagName('COL2')[i].firstChild.data);

}



window.status = '';


return false;

}

}

</script>

Bien hasta aqui seria todo tu codigo javascript necesario


Ahora como ultimo vamos con el php...

Creas un php con el nombre accion_carga_segundo_combo.php

este archivo va a publicar un XML por lo tanto debe llevar los tags de xml para identificarlo como tal. Va el codigo


<?php
header('Content-Type: text/xml');
header ("Expires: Fri, 14 Mar 1980 20:53:00 GMT"); //la pagina expira en fecha pasada
header ("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT"); //ultima actualizacion ahora cuando la cargamos
header ("Cache-Control: no-cache, must-revalidate"); //no guardar en CACHE
header ("Pragma: no-cache");

$host = "host";
$user = "usuario";
$password = "password";
$db = "base de datos";

$link = mysql_connect($host, $user, $password);

mysql_select_db($db,$link);

$sql = "SELECT * FROM medida_perfil ";
$sql .= " WHERE campo_en_relacion_con_primer_combo = '$id' ";

$result = mysql_query($sql);

if (mysql_num_rows($result) > 0) {

$string = '';
$string = '<?xml version="1.0" encoding="UTF-8" standalone="yes"?>';
$string .= "<MARCAS>\n";

while ($row = mysql_fetch_assoc($result)){

$string .= "<LINEA>\n";
$string .= "<COL1>".$row[id_segundo_combo]."</COL1>\n";
$string .= "<COL2>".$row[descripcion]."</COL2>\n";
$string .= "</LINEA>\n";


}

$string .= "</MARCAS>\n";

echo $string;
}

?>

LISTO... de esta forma debe funcionar sin problemas....

Cualquier cosa escribeme a mi correo personal y lo vemos.... Pero deberia andar sin problemas...

salu2.

hola sabes esta bacn el codigo que has ddejado lo he tratao de aplicar a un ejemplo que quiero hacer pero la verdad q no puedo no si se podrias orientarme un poco de como funciona asi a grosdo modo y q tablas interactuan ahi ya q hay algunos vacios qno entiendo bien ya q no tengo ni se como es tu modelo de datos gracias..!!

podrian poner le codigo html donde se encuentran los select y la invocacion a los metodos.

saludos

a pues auiq esta lo que necesitan....

mirese este postyo tambien tube ese problema ;)

http://php.novacreations.net/viewtopic.php?t=53

donde? no se ve...

Hola, soy nuevo en Ajax y con otro codigo logro que el segundo combo se recargue segun lo que dice el primero, el problema es que necesito un tercero segun el segundo y un cuarto segun el tercero y no logro hacerlo, podrias colaborarme.
Tu codigo esta un poco complicado sobre todo donde dice "este archivo va a publicar un XML por lo tanto debe llevar los tags de xml para identificarlo como tal. Va el codigo" creo que no los tengo todos.

Muchas Gracias