Hola buenas tardes disculpen tengo una duda, quiero agregar boton que al darle click me agregue N selects dinámicos
Este el html que tengo:
<h3>Origen: </h3>
<input type="hidden" name="">
<div class="input-group">
<span class="input-group-addon">Estado: </span>
<?php include_once("conexion.php");
$sql = $bd->query('SELECT * FROM estados');
if(filas($sql) > 0){ ?>
<select name="estados" id="estados" class="form-control">
<option value="0">Elegir</option>
<?php
while($dato = recorrer($sql)) { ?>
<option value="<?php echo $dato[1]; ?>"><?php echo $dato[2]; ?></option>
<?php } ?>
</select>
<?php }else{
echo "<button>Agregar nuevo</button>";
}
?>
</div>
<div class="input-group">
<span class="input-group-addon">Ciudad: </span>
<select id="municipios" name="municipios" class="form-control">
<option value="">...</option>
</select>
<span class="input-group-btn"><a href="localidad.php" role="button" class="btn btn-success"> + </a></span>
</div>
<h3>Destino: </h3>
<div class="input-group">
<span class="input-group-addon">Estado: </span>
<?php include_once("conexion.php");
$sql = $bd->query('SELECT * FROM estados');
if(filas($sql) > 0){ ?>
<select name="estados1" id="estados1" class="form-control">
<option value="0">Elegir</option>;
<?php
while($dato = recorrer($sql)) { ?>
<option value="<?php echo $dato[1]; ?>"><?php echo $dato[2]; ?></option>;
<?php }?>
</select>
<?php }else{
echo "<button>Agregar nuevo</button>";
}
?>
</div>
<div class="input-group">
<span class="input-group-addon">Ciudad: </span>
<select id="municipios1" name="municipios1" class="form-control">
<option value="">...</option>
</select>
Tengo este script:
<script type="text/javascript">
$(document).ready(function () {
$('#estados').change(function(event){
$('.load').fadeIn();
if($(this).val()!= '0'){
$.post('municipios.php', {'id_estado':$(this).val()}, function(data){
$('#municipios').html(''+data);
});
$('.load').fadeOut();
}else{
$('.load').fadeOut();
//a
}
});
$('#estados1').change(function(event){
$('#load').fadeIn();
if($(this).val()!= '0'){
$.post('municipios.php', {'id_estado1':$(this).val()}, function(data){
$('#municipios1').html(''+data);
});
$('#load').fadeOut();
}else{
$('#load').fadeOut();
//a
}
});
});
</script>
el codigo ya me funciona perfecto la duda que tengo es como hacer para agregar otro select con los mismos datos algun consejo
De los respectivos dos primeros selects dinámicos que tengo lo que no se hacer aun es de cierta manera generar N selects dinámicos lo que no eh encontrado es algun ejemplo de ello.
El modulo del sistema que estoy haciendo es de rutas así es el proceso
- Selecciono el origen estado, después la ciudad de ese estado
- Selecciono el destino estado, después la ciudad de ese estado
- Si va haber paradas en algún estado dar click en el botón para mostrar otro select y así seleccionar un estado y su municipio