![Antiguo](http://static.forosdelweb.com/fdwtheme/images/statusicon/post_old.gif)
03/04/2014, 11:10
|
| | Fecha de Ingreso: marzo-2014 Ubicación: Mexico
Mensajes: 5
Antigüedad: 10 años, 11 meses Puntos: 0 | |
Select Dinámico PHP-JavaScript Hola, estoy intentando hacer un Select dinámico para mi pagina, la idea es que el se hagan hasta 3 select por parte del usuario en un formulario.
Encontré un ejemplo que hace exactamente eso, pero por alguna razón a mi no me funciona....Dejo el código de ejemplo:
HTML ( index.html) Código HTML: <!DOCTYPE html>
<html>
<head>
<title>Seleccion</title>
<script type="text/javascript" src="jquery.2.1,0.js"></script>
</head>
<body>
<select id="CboDepartamentos"></select>
<select id="CboProvincias"></select>
<select id="CboDistritos"></select>
<script type="text/javascript">
$(document).ready(function(){
$.ajax({
url:'datos.php?Accion=GetDepartamentos',
success: function(Datos){
for ( x=0; x<Datos.length; x++ )
{
$("#CboDepartamentos").append(new Option(Datos[x].Departamento, Datos[x].IdDepartamento));
}
}
})
$('#CboDepartamentos').Change(function(){
$('#CboProvincias,#CboDistritos').empty();
$.getJSON('datos.php',{Action:'GetProvincias',IdDepartamento:$('#CboDepartamentos option:selected').val()}, function(Datos){
for( x=0; x<Datos.length; x++ )
{
$("#CboProvincias").append(new Option(Datos[x].Provincia, Datos[x].IdProvincia));
}
})
});
$('#CboProvincias').change(function(){
$('#CboDistritos').empty();
$.getJSON('datos.php', {Action:'GetDistritos',IdProvincia:$('#CboProvincias option:selected').val()}, function(Datos){
for( x=0; x<Datos.length; x++ )
{
$("#CboDistritos").append(new Option(Datos[x].Distritos, Datos[x].IdDistritos));
}
})
});
});
</script>
</body>
</html> PHP ( datos.php) Código PHP: <?php
mysql_connect('localhost','Visitante','');
mysql_select_db('peru');
$Accion = $_REQUEST['Accion'];
if(is_callable($Accion))
{
$Accion();
}
function GetDepartamentos()
{
header('Content-Type: application/json');
$Departamentos = array();
$Consulta = mysql_query("SELECT¨* FROM departamentos");
while($Fila = mysql_fetch_assoc($Consulta))
{
$Departamentos[] = $Fila;
}
echo json_encode($Departamentos);
}
function GetProvincias()
{
header('Content-Type: application/json');
$Provincias = array();
$Consulta = mysql_query("SELECT¨* FROM provincias WHERE IdDepartamento = ".$_REQUEST['IdDepartamento']);
while($Fila = mysql_fetch_assoc($Consulta))
{
$Provincias[] = $Fila;
}
echo json_encode($Provincias);
}
function GetDistritos()
{
header('Content-Type: application/json');
$Distritos = array();
$Consulta = mysql_query("SELECT¨* FROM distritos WHERE IdProvincia = ".$_REQUEST['IdProvincia']);
while($Fila = mysql_fetch_assoc($Consulta))
{
$Distritos[] = $Fila;
}
echo json_encode($Distritos);
}
?> DataBase ( peru)
Código:
CREATE DATABASE IF NOT EXISTS `peru` /*!40100 DEFAULT CHARACTER SET utf8 */;
USE `peru`;
CREATE TABLE IF NOT EXISTS `departamentos` (
`IdDepartamento` int(11) NOT NULL AUTO_INCREMENT,
`Departamento` varchar(150) NOT NULL,
PRIMARY KEY (`IdDepartamento`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=6 ;
INSERT INTO `departamentos` (`IdDepartamento`, `Departamento`) VALUES
(1, 'AMAZONAS'),
(2, 'ANCASH'),
(3, 'APURIMAC'),
(4, 'AREQUIPA'),
(5, 'AYACUCHO');
CREATE TABLE IF NOT EXISTS `distritos` (
`IdDistrito` int(11) NOT NULL AUTO_INCREMENT,
`IdProvincia` int(11) NOT NULL,
`Distrito` varchar(150) NOT NULL,
PRIMARY KEY (`IdDistrito`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=11 ;
INSERT INTO `distritos` (`IdDistrito`, `IdProvincia`, `Distrito`) VALUES
(1, 1, 'BALSA'),
(2, 1, 'CHETOS'),
(3, 2, 'GRANADA'),
(4, 2, 'HUANCAS'),
(5, 3, 'LEVANTO'),
(6, 3, 'MOLINO'),
(7, 4, 'SALSAS'),
(8, 4, 'LEIME'),
(9, 5, 'MONTEVIDEO'),
(10, 5, 'PANAMA');
CREATE TABLE IF NOT EXISTS `provincias` (
`IdProvincia` int(11) NOT NULL AUTO_INCREMENT,
`IdDepartamento` int(150) NOT NULL,
`Provincia` varchar(150) NOT NULL,
PRIMARY KEY (`IdProvincia`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=11 ;
INSERT INTO `provincias` (`IdProvincia`, `IdDepartamento`, `Provincia`) VALUES
(1, 1, 'CHACHA'),
(2, 1, 'BAGUA'),
(3, 2, 'CONDOR'),
(4, 2, 'LUYA'),
(5, 3, 'RODRI'),
(6, 3, 'UTCUBA'),
(7, 4, 'HUAREZ'),
(8, 4, 'AIJA'),
(9, 5, 'ANTON'),
(10, 5, 'ASONCION');
El ejemplo es igual a lo que quiero hacer solo cambia el nombre de las tablas y campos.
Espero me puedan ayudar a corregir el código |