Estoy tratando de ejecutar un javascript en un innerHTML para q se me ejecute un javascript no se q estoy haciendo mal, me gustaria q me ayudaran. Quiero q al darle click ena gregar me salga una fila y al seleccionar algun pais me salgan las diferentes opciones q tiene cada pais y con los q no tienen opciones no me salga nada
Código:
<head>
<script >
function cambia_producto(){
var productos_1=new Array("Seleccione una Opción","Bogota","Medellin","Cartagena")
var productos_2=new Array("Seleccione una Opción","Valparaiso")
var productos_3=new Array("Seleccione una Opción","Rosario","BsAs","LunaPark")
var subproductos
subproductos = document.getElementById("subproductos")[document.getElementById("subproductos").selectedIndex].value
if (subproductos >= 1 && subproductos <= 3 ) {
document.getElementById("producto").style.visibility = 'visible';
document.getElementById("valor").style.visibility = 'visible';
document.getElementById("valorA").style.visibility = 'visible';
mis_productos=eval("productos_" + subproductos);
num_productos = mis_productos.length;
document.getElementById("producto").length = num_productos;
for(i=0;i<num_productos;i++){
document.getElementById("producto").options[i].value=mis_productos[i];
document.getElementById("producto").options[i].text=mis_productos[i];
}
}else{
document.getElementById("producto").length = 1;
document.getElementById("producto").options[0].value = "Seleccione una Opción";
document.getElementById("producto").options[0].text = "Seleccione una Opción";
document.getElementById("producto").style.visibility = 'hidden';
document.getElementById("valor").style.visibility = 'hidden';
document.getElementById("valorA").style.visibility = 'hidden';
}
document.getElementById("producto").options[0].selected = true;
}
function agregar() {
var tr, td, tabla;
tabla = document.getElementById('Tabla1');
tr = tabla.insertRow(tabla.rows.length);
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<select name='subproductos' id='subproductos' onchange='cambia_producto()' >" +
"<option value='0' selected>Seleccione opción "+
"<option value='1'>Colombia"+
"<option value='2'>CHILE"+
"<option value='3'>Argentina "+
"<option value='4'>Peru"+
"<option value='5'> Brasil "+
"<option value='6'>Venezuela"+
"<option value='7'>Paraguay"+
"<option value='8'>Uruguay"+
"<option value='9'>Ecuador"+
"</select>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<select name='producto' id='producto' style='visibility:hidden'>" +
"<option value='0' selected>Seleccione opción "+
"</select>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='textbox' name='valor' id='valor' style='visibility:hidden'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML = "<input type='textbox' name='valorA' id='valorA'+ style='visibility:hidden'>";
td = tr.insertCell(tr.cells.length);
td.innerHTML="<input name='button' type='button' onClick='borrarUltima(this);' value='Eliminar' > ";
td = tr.insertCell(tr.cells.length);
}
function borrarUltima() {
ultima = document.all.Tabla1.rows.length - 1;
if(ultima > -1){
document.all.Tabla1.deleteRow(ultima);
}
}
</script>
</head>
<body>
<form name="Form1" method="post">
<table border="1" id="Tabla1">
<tr>
<td>Pais</td>
<td>ciudad</td>
<td>Comentario</td>
<td>Comentario Adicional</td>
<td>Eliminar</td>
</tr>
<tr>
<td>
<select name=subproductos id=subproductos onchange="cambia_producto()">
<option value="0" selected>Seleccione opción
<option value="1">Colombia
<option value="2">CHILE
<option value="3">Argentina
<option value="4">Peru
<option value="5">Brasil
<option value="6">Venezuela
<option value="7">Paraguay
<option value="8">Uruguay
<option value="9">Ecuador
</select>
</td>
<td>
<select name=producto id=producto style="visibility:hidden">
<option value="Seleccione una Opción">Seleccione una Opción
</select>
</td>
<td>
<input type=textbox name="valor" id="valor" style="visibility:hidden">
</td>
<td>
<input type=textbox name="valorA" id="valorA" style="visibility:hidden;disabled:enabled">
</td>
</tr>
<input type="button" value="Agregar" onclick="agregar()">
</form>
</body>
</html>
