Hola.
Necesito una ayuda vuestra para un principiante como yo. Estoy haciendo una aplicacion donde un select me mostraria ciertas filas de una tabla. Lo he logrado hacer con IE pero con FF no, uso para ello la propiedad display:'' para IE y display:'table-row' para FF y mostrar las filas (FF no lo hace) y para ocultarlas display:'none' en ambos. Aquí os dejo el código por si os sirve.
En el html utilizo php también
Código:
<td class="td"><select name="sel" onChange="visible(this.value);" id="sel" class="textbox_nombre">
<option value="0" selected>1</option>
<?php for ($n=1;$n<7;$n++){ ?>
<option value="<?php echo $n; ?>"><?php echo $n+1; ?></option>
<?php } ?>
</select></td>
más código
Código:
<div align="center" id="cajas">
<table id="tc" class="title1"><script language="javascript">creaTabla();</script>
</table>
</div>
y las funciones javascript
Código:
function creaTabla(){
var texto = new Array();
texto[0] = "primer";
texto[1] = "segundo";
texto[2] = "tercer";
texto[3] = "cuarto";
texto[4] = "quinto";
texto[5] = "sexto";
texto[6] = "séptimo";
texto[7] = "Fecha:";
texto[8] = "Fecha:";
for (i = 0; i <= 6; i++){
document.write("<tr id='caja"+ i );
if (i == 0){
document.write("' style='display:'>"); <!--siempre mostrar la primera fila-->
}
else document.write("' style='display:none'>");
document.write("<td style='background-color:#B0C4DE'>"+ texto[7] + texto[i] +"</td><td style='background-color:#B0C4DE'><input type='text' name='fd"+ i +"' id='fd"+ i +"' autocomplete='off' onFocus='setupcalendars(this, catcalc"+i+");' /></td><td style='background-color:#B0C4DE'>"+ texto[8] + texto[i] +"</td><td style='background-color:#B0C4DE'><input type='text' name='fcd"+ i +"' id='fcd"+ i +"' autocomplete='off' onFocus='setupcalendars(this, catcalc"+i+");' /></td></tr>");
}
}
function visible(sel){
var ca = new Array();
ca[1] =document.getElementById("caja1");
ca[2] =document.getElementById("caja2");
ca[3] =document.getElementById("caja3");
ca[4] =document.getElementById("caja4");
ca[5] =document.getElementById("caja5");
ca[6] =document.getElementById("caja6");
for (i = 1; i <= 6; i++){
if (i <= sel){
if (navigator.appName == "Microsoft Internet Explorer"){
ca[i].style.display="";}
else ca[i].style.display="table-row;";
}
else ca[i].style.display="none";
}
}
Utilicé estas otras funciones pero a la hora de pasar los valores de los inputs fd0..fd6 y fcd0..6, en FF no me los muestra tampoco, sí en IE. Estas son las funciones
Código:
function creaTabla(s){
var texto = new Array();
texto[0] = "primer";
texto[1] = "segundo";
texto[2] = "tercer";
texto[3] = "cuarto";
texto[4] = "quinto";
texto[5] = "sexto";
texto[6] = "septimo";
texto[7] = "Fecha:";
texto[8] = "Fecha:";
var table = document.getElementById('tc');
for (j=0;j<=s;j++){
var row = table.insertRow(-1);
row.setAttribute("id", "caja"+j);
var cell = row.insertCell(-1);
cell.setAttribute("bgColor", "#B0C4DE");
cell.innerHTML = texto[7]+texto[j];
cell = row.insertCell(-1);
cell.setAttribute("bgColor", "#B0C4DE");
cell.innerHTML = '<input type="text" name="fd'+j+'" id="fd'+j+'" onFocus="setupcalendars(this, catcalc'+j+');">';
cell = row.insertCell(-1);
cell.setAttribute("bgColor", "#B0C4DE");
cell.innerHTML = texto[8]+texto[j];
cell = row.insertCell(-1);
cell.setAttribute("bgColor", "#B0C4DE");
cell.innerHTML = '<input type="text" name="fcd'+j+'" id="fcd'+j+'" onFocus="setupcalendars(this, catcalc'+j+');">';
}
}
function visible(valor){
var rws = document.getElementById("tc").rows;
len = rws.length;
for (i=0;i<len;i++){
document.getElementById("tc").deleteRow(-1);
}
creaTabla(valor);
}
Gracias por vuestras respuestas.