Tengo 5 selects en cascada con la jerarquia siguiente: Ley, Titulo, Capitulo, Sección y Subsección. He conseguido que al seleccionar una ley, se muestren los titulos a los que pertenecen esa ley, si después selecciono un titulo, este afecta al select de capitulos y me muestra a los capitulos que pertenecen a ese titulo ... y así sucesivamente. Este es el codigo jquery que utilizo:
<script type="text/javascript">
$(document).ready(function(){
$("#nuevotitulo").hide();
$("#sel_ley").change(function(){
var leyid = $(this).val();
//Fin mostrar/ocultar
$.ajax({
url: 'gets/gettitulos.php',
type: 'post',
data: {select_ley:leyid},
dataType: 'json',
success:function(response){
var len = response.length;
$("#sel_titulo").empty();
for( var i = 0; i<len; i++){
var id_tit = response[i]['id_tit'];
var num_tit = response[i]['num_tit'];
var nombre_tit = response[i]['nombre_tit'];
$("#sel_titulo").append("<option value='"+id_tit+"'> TITULO "+num_tit+" "+nombre_tit+"</option>");
}
}
});
});
});
</script>
<!-- Script Titulo a Capitulos-->
<script type="text/javascript">
$(document).ready(function(){
$("#nuevocapitulo").hide();
$("#sel_titulo").change(function(){
var tituloid = $(this).val();
//Ocultamos o mostramos boton nuevocapitulo
//Fin mostrar/ocultar
$.ajax({
url: 'gets/getcapitulos.php',
type: 'post',
data: {select_titulo:tituloid},
dataType: 'json',
success:function(response){
var len = response.length;
$("#nuevocapitulo").show();
$("#sel_capitulo").empty();
for( var i = 0; i<len; i++){
var id_cap = response[i]['id_cap'];
var num_cap = response[i]['num_cap'];
var nombre_cap = response[i]['nombre_cap'];
$("#sel_capitulo").append("<option value='"+id_cap+"'> Capitulo "+num_cap+" "+nombre_cap+"</option>");
}
}
});
});
});
</script>
<!-- Script Capitulos a Secciones-->
<script type="text/javascript">
$(document).ready(function(){
$("#sel_capitulo").change(function(){
var capituloid = $(this).val();
$.ajax({
url: 'gets/getsecciones.php',
type: 'post',
data: {select_capitulo:capituloid},
dataType: 'json',
success:function(response){
var len = response.length;
$("#sel_seccion").empty();
for( var i = 0; i<len; i++){
var id_sec = response[i]['id_sec'];
var num_sec = response[i]['num_sec'];
var nombre_sec = response[i]['nombre_sec'];
$("#sel_seccion").append("<option value='"+id_sec+"'> Seccion "+num_sec+" "+nombre_sec+"</option>");
}
}
});
});
});
</script>
<!-- Script secciones a SubSecciones-->
<script type="text/javascript">
$(document).ready(function(){
$("#sel_seccion").change(function(){
var seccionid = $(this).val();
$.ajax({
url: 'gets/getsubsecciones.php',
type: 'post',
data: {select_seccion:seccionid},
dataType: 'json',
success:function(response){
var len = response.length;
$("#sel_subseccion").empty();
for( var i = 0; i<len; i++){
var id_sub = response[i]['id_sub'];
var num_sub = response[i]['num_sub'];
var nombre_sub = response[i]['nombre_sub'];
$("#sel_subseccion").append("<option value='"+id_sub+"'> Seccion "+num_sub+" "+nombre_sub+"</option>");
}
}
});
});
});
</script>
Tengo 2 problemas (entiendo que relacionados): El primero es que solo consigo que el select afecte al select jerarquico inferior con lo que si después de seleccionar una ley, luego un titulo, y luego un capitulo, si vuelvo a seleccionar una ley, solo se "refresca" el titulo y sigue mostrando los datos de capitulos que no pertenecen a esa ley. El segundo, si en mi base de datos, el primer titulo de una ley tiene capitulos o secciones o subsecciones, al hacer select en una ley, me muestra el primer titulo pero no los capitulos o secciones o subsecciones que pueden depender de él. (solo afecta a un select).
Haciendo pruebas no he conseguido que un select afecte a más de uno... a ver si me podeis ayudar. Si necesitais mas info no dudeis en pedirme.. Gracias!!