Tengo un código en el que me clona la primer fila de una tabla, tengo dos select
uno dependiente del otro, es decir dependiendo de lo que yo seleccione en el primer select
(TIPO_ACTIVIDAD
), me listara unas opciones en el segundo(SUBTIPO
), el clona bien, aunque no copia los select
, y las opciones se despliegan bien, solo si es la primer fila, y es ese el problema, cuando clono una fila, y voy a seleccionar una de las opciones del primer select
bien. pero cuando voy seleccionar la del segundo me llama las opciones del select
de la fila superior, no se que hacer pues se que si clona la fila clona, estos son los códigos:
JS
Código para clonar primera fila
<script>
$(function(){
// Clona la fila oculta que tiene los campos base, y la agrega al final de
la tabla
$("#adicional").on('click', function(){
$("#tabla tbody
tr:eq(0)").clone().removeClass('fila-fija').appendTo("#tabla");
});
// Evento que selecciona la fila y la elimina
$(document).on("click",".eliminar",function(){
var parent = $(this).parents().get(0);
$(parent).remove();
});
});
</script>
Código para mostrar Selects dependientes
<script type="text/javascript">
function cargarSUBTIPO(valor) {
var arrayValores=new Array(
new Array("Arreglos","Arreglo Bidireccional","Arreglo Bidireccional"),
new Array("Arreglos","Arreglo Pymes","Arreglo Pymes"),
new Array("Arreglos","VT Mejoramiento Servicio","VT Mejoramiento
Servicio"),
new Array("Desconexiones","Desconexion Carta","Desconexion Carta"),
new Array("Desconexiones","Desconexion x ","Desconexion x")
);
if(valor==0) {
.getElementById("SUBTIPO").disabled=true;
}else{
document.getElementById("SUBTIPO").options.length=0;
document.getElementById("SUBTIPO").options[0]=new
Option("Seleccione...", "Seleccione...");
for(i=0;i<arrayValores.length;i++) {
if(arrayValores[i][0]==valor) {
document.getElementById("SUBTIPO").options
[document.getElementById("SUBTIPO").options.length]
=new Option(arrayValores[i][2], arrayValores[i][1]);
}
}
document.getElementById("SUBTIPO").disabled=false;
}
}
function seleccionado_SUBTIPO(value) {
var v1 = document.getElementById("TIPO_ACTIVIDAD");
var valor1 = v1.options[v1.selectedIndex].value;
var text1 = v1.options[v1.selectedIndex].text;
var v2 = document.getElementById("SUBTIPO");
var valor2 = v2.options[v2.selectedIndex].value;
var text2 = v2.options[v2.selectedIndex].text;
}
</script>
HTML
<td>
<select name="TIPO_ACTIVIDAD[]" id="TIPO_ACTIVIDAD"
onchange='cargarSUBTIPO(this.value);'>
<option value="">Selecciones...</option>
<option value="Arreglos">Arreglos</option>
<option value="Desconexiones">Desconexiones</option>
</select>
</td>