Problema funcion sensilla ?

vili86 · #1 (**permalink**) 02/11/2009, 08:42

Amigos no se q es lo q pasa con este script.

No funciona.

Código javascript:

Ver original<script type="text/javascript" language="javascript">
    //function mostrarOcultarTablas(id){
    function mostrarOcultarTablas(id){
            mostrado = 0;
            elem = document.getElementById(id);
            if(elem.style.display == 'block'){
                    mostrado = 1;
                    elem.style.dispaly = 'none';
            }
            else {      
            if(mostrado != 1)
            elem.style.display ='block';
            }
    }
            
    </script>

Código html:

Ver original<body>
<div id="tabla1" style="display:none">
<table width="200" border="1">
  <tr>
    <td>CARLOS</td>
    <td>&nbsp;</td>
  </tr>
</table>
</div>
<div  id="tabla2" style="display: none">
<table width="200" border="1">
  <tr>
    <td>ROLO</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
 
</table>
<a href="javascript:mostrarOcultarTablas('tabla1')">Mostrar tabla 1</a>
 
<a href="javascript:mostrarOcultarTablas('tabla2')">Mostrar tabla 2</a> 
</div>
</body>
 
No me aparecer nada en la pantalla ni los links ????????

ceSharp · #2 (**permalink**) 02/11/2009, 08:51

Hola vili86,

Lo primero es que los <a href... deberías sacarlos fuera del div porque en la carga está oculto y, por tanto, no se muestran.
Por otro lado revisa tu código javascript porque tienes un 'DISPALY' en vez de 'DISPLAY'

salu2

vili86 · #3 (**permalink**) 02/11/2009, 08:55

Gracias ceSharp Solucionado, pero tengo ya una pregunta que quisiera aprovechar aqui trabajo con firefox pero cuando me voy a mi consola de errores no me muestra tan detalladamente el error en javascript Existe algun componente para firefox de javascript mas a detalle ???'

ceSharp · #4 (**permalink**) 02/11/2009, 09:17

ains, yo es que firefox ni idea... yo soy del lado oscuro (IE).... a ver si alguien te puede ayudar que conozca mejor firefox.

salu2

zerokilled · #5 (**permalink**) 02/11/2009, 09:26

si no es el mismo codigo, muestra el codigo que genera error y el mensaje de error que te aparece en firefox.

vili86 · #6 (**permalink**) 02/11/2009, 10:31

Quiero hacer una pequeña modificacion a mi script
La idea es que cuando clikeo a Mostrar tabla 2 me muestra dicha tabla pero desaparezca la tabla 1 que esta por defecto y cuando vuelva a clikera tabla 2 desaparezca tabla dos y aparezca la tabla q estaba por defecto ????

Código javascript:

Ver original<script type="text/javascript" language="javascript">
    //function mostrarOcultarTablas(id){
    function ocultar(id){
            mostrado = 0;
            elem = document.getElementById(id);
            if(elem.style.display == 'block'){
                    mostrado = 1;
                    elem.style.display = 'none';
            }
            else {      
            if(mostrado != 1)
            elem.style.display ='block';
            }
    }
            
    </script>

Código html:

Ver original<body>
<center>
<fieldset id="Filed1">
<legend class="Estilo1">Sección Consultas</legend>
<form action="index.php?mod=consultas&pag=proceso" method="post" name="buscar" onsubmit="return validar_busqueda(this)">
<div  id="tabla1" style="display:block;">
 <table  border="0" align="center"  bgcolor="#EEEEEE">
  <tr>
    <th scope="col" colspan="2" align="center"> <span class="Estilo1"></span> </th>
    
  </tr>
  <tr>
    <td><input type="text" size="40"  name="frase" value="<?php echo $_SESSION['frase'] ?>" ></td>
    <td><input type="submit" name="buscar" value="Buscar"  ></td>
    <td></td>
   </tr>
</table>
</form>
</table>
</div>
<div  id="tabla2" style="display:none;">
<form action="index.php?mod=consultas&pag=proceso" method="post" name="buscar" onsubmit="return validar_busqueda(this)">
 <table  border="0" align="center"  bgcolor="#EEEEEE">
  <tr>
    <th scope="col" colspan="2" align="center"> <span class="Estilo1"></span> </th>
    
  </tr>
  <tr>
    <td><input type="text" size="40"  name="frase" value="<?php echo $_SESSION['frase'] ?>" ></td>
    <td><input type="submit" name="buscar" value="Buscar"  ></td>
    <td>criterrslllllllllllllllllllllllllllllllllllllllllllllllllllll</td>
   </tr>
</table>
</form>
</table>
</div>
 
<a href="javascript:ocultar('tabla2')">Mostrar tabla 2</a> 
</body>
</fieldset>
</html>

ceSharp · #7 (**permalink**) 02/11/2009, 11:00

mira a ver si te vale esto:

-----------------------------------------------
var t1 = false;
function mostrarOcultarTablas(tabla)
{
var tabla1 = document.getElementById('tabla1');
var tabla2 = document.getElementById('tabla2');

switch(tabla)
{
case 'tabla1':
if(tabla1.style.display == 'none')
{
if(tabla2.style.display == 'none')
{
tabla1.style.display = '';
t1 = true;
}
}
else
{tabla1.style.display = 'none';t1 = false;}
break;
case 'tabla2':
if(tabla2.style.display == 'none')
{
tabla2.style.display = '';
if(tabla1.style.display == '')
t1 = true;
tabla1.style.display = 'none';
}
else
{
tabla2.style.display = 'none';
if(t1)
{tabla1.style.display = '';t1 = false;}
}
break;
}
}
---------------------------------------------------

la variable global t1 está controlando si se estaba mostrando o no la tabla1, para luego recuperarla (una vez que ocultas la tabla2) o continuar ocultándola.

salu2