mostrar al dar click

HerbyBocho · #1 (**permalink**) 06/06/2011, 10:35

Buen dia programadores!

Bueno, quisiera que me ayudasen con una pequeño percance....quiero mostrar una tabla/lista al darle click a un boton!

mogurbon · #2 (**permalink**) 06/06/2011, 10:39

y tienes algo hecho? para que muestres el codigo

rjulio21 · #3 (**permalink**) 06/06/2011, 10:43

eso lo haces con JavaScript y CSS.... define dos clases CSS.

Código CSS:

Ver original.visible{
display:block;
}
invisible{display:none}

el html.

Código HTML:

Ver original<SCRIPT type="javaScript">
function mostrarTabla(){}
     a = document.getElementById('tabla')
     a.classname='visible'
}
<body>
<boton value="ver" onClick="mostrarTabla()">
<table class="invisible" id="tabla">
</body>

y listo... XD

HerbyBocho · #4 (**permalink**) 06/06/2011, 10:59

bueno, estoy programando en Adobe Dreamweaver CS5-PHP

he aqui el codigo:

Código PHP:

Ver original<html>
<head>
<title>Listas</title>
 
        <script type="text/javascript">
        function showMpio(str)
        {
        if (str=="")
          {
          document.getElementById("txtHint").innerHTML="";
          return;
          }
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
            }
          }
        xmlhttp.open("GET","getmpio.php?q="+str,true);
        xmlhttp.send();
        }
        </script>
</head>
<body>
<img align="right" src="logo proyecto.jpg" width="451" height="176">
 
 
<?php
include_once ("clase.php"); 
    $finicio="";
    $ffinal="";
    $numestancia="";
    $nomestancia="";
    $direstancia="";
    $telestancia="";
    $nombre="";
    $apaterno="";
    $amaterno="";
    $email="";
    $estado="";
    $municipio="";
    $idevaluador1="";
    $idusuario="";
 
if (isset($_GET['md'])) 
{
    $usuario=new Usuario($_GET['md']);  //Obtener Datos del cliente
    $finicio=$usuario->getFinicio();        
    $ffinal=$usuario->getFfinal();  
    $numestancia=$usuario->getNumestancia();        
    $nomestancia=$usuario->getNomestancia();
    $direstancia=$usuario->getDirestancia();
    $telestancia=$usuario->getTelestancia();
    $nombre=$usuario->getNombre();
    $apaterno=$usuario->getApaterno();
    $amaterno=$usuario->getAmaterno();
    $email=$usuario->getEmail();
    $estado=$usuario->getEstado();
    $municipio=$usuario->getMunicipio();
    $idevaluador1=$usuario->getIdevaluador1();
}
?>
 
<div >
  <form method="POST" action="principal.php"> 
<input type="hidden" name="idusuario" value="<?php print $idusuario ?>">
<table border=3>
 
<tr>
    <td>Fecha de Inicio</td>
    <td><input type="text" name="finicio" value = "<?php print $finicio ?>">'A&ntilde;o-Mes-Dia'</td>
</tr>
<tr>
    <td>Fecha de Cierre</td>
    <td><input type="text" name="ffinal"value = "<?php print $ffinal ?>">'A&ntilde;o-Mes-Dia'</td>
</tr>
<tr>
    <td>Estado</td>
    <td><select name="estados" onChange="showMpio(this.value)"> 
 
 
        print '<option SELECTED>Seleccione</option>' ;
  <?php
    $estados=new Estados();
    $estados= $estados->getEstado();
    while ($row=mysql_fetch_Array($estados))
print '<option value='.$row['Id_Estados'].'>'.$row['Estado'].'</option>' ;
    ?> 
  </select>
</td>
</tr>
<tr>
<tr>
    <td>Municipio</td>
    <td id="txtHint"></td>
</tr>
</table>
</form>
</div>
<form
   action="">
    <input type="submit" name="Mostrar" id="Mostrar" value="Mostrar" onClick=""/>
<?php
if (isset($_POST['submit'])&&!is_numeric($_POST['idusuario'])) 
 
{
    $usuario=new Usuario();
    //print_r($_POST);
    $usuario->setFinicio($_POST['finicio']); 
    $usuario->setFfinal($_POST['ffinal']);  
    $usuario->setNumestancia($_POST['numestancia']);
    $usuario->setNomestancia($_POST['nomestancia']);
    $usuario->setDirestancia($_POST['direstancia']);
    $usuario->setTelestancia($_POST['telestancia']);
    $usuario->setNombre($_POST['nombre']);
    $usuario->setApaterno($_POST['apaterno']);
    $usuario->setAmaterno($_POST['amaterno']);
    $usuario->setEmail($_POST['email']);
    
    //faltaba agregarlos aqui 
    $usuario->setEstado($_POST['estados']);
    $usuario->setMunicipio($_POST['municipios']);
    //faltaba agregarlos aqui   
    
    $usuario->setIdevaluador1($_POST['idevaluador1']);
    $usuario->setIdevaluador2($_POST['idevaluador2']);
    $usuario->setIdevaluador3($_POST['idevaluador3']);
    $usuario->setIdevaluador4($_POST['idevaluador4']);
    $usuario->setIdevaluador5($_POST['idevaluador5']);
    $usuario->insertUsuario(); 
}
 
if (isset($_POST['submit'])&&is_numeric($_POST['idusuario'])) 
{
    $usuario=new Usuario($_POST['idusuario']); 
    $usuario->setFinicio($_POST['finicio']); 
    $usuario->setFfinal($_POST['ffinal']);  
    $usuario->setNumestancia($_POST['numestancia']);    
    $usuario->setNomestancia($_POST['nomestancia']);
    $usuario->setDirestancia($_POST['direstancia']);
    $usuario->setTelestancia($_POST['telestancia']);
    $usuario->setNombre($_POST['nombre']);
    $usuario->setApaterno($_POST['apaterno']);
    $usuario->setAmaterno($_POST['amaterno']);
    $usuario->setEmail($_POST['email']);
    
    //faltaba agregarlos aqui 
    $usuario->setEstado($_POST['estados']);
    $usuario->setMunicipio($_POST['municipios']);
    //faltaba agregarlos aqui   
    
    $usuario->setIdevaluador1($_POST['idevaluador1']);
    $usuario->setIdevaluador2($_POST['idevaluador2']);
    $usuario->setIdevaluador3($_POST['idevaluador3']);
    $usuario->setIdevaluador4($_POST['idevaluador4']);
    $usuario->setIdevaluador5($_POST['idevaluador5']);
    $usuario->updateUsuario(); 
}
if (isset($_GET['br'])&&is_numeric($_GET['br'])) 
{
    $usuario=new Usuario();
    $usuario->deleteUsuario($_GET['br']); 
}
 
?>
</form>
</td>
</body>
</html>

stramin · #5 (**permalink**) 06/06/2011, 11:05

ah noooo, no te compliques tanto mira, prueba este código:

Código HTML:

Ver original<a href="javascript:;" onclick="document.getElementById('el_select').style.display='block';">aparece!</a>
<select id="el_select" style="display:none;">
</select>

no necesitas declarar reglas css, ni hacer funciones, ni declarar variables, ni nada, solo ejecuta la instrucción y haz que aparezca.

HerbyBocho · #6 (**permalink**) 06/06/2011, 11:15

gracias a todos pero mas a stramin jeje, gracias carnal!

rjulio21 · #7 (**permalink**) 06/06/2011, 11:30

A mi parecer es lo mismo. solo que poniendo la funcion javaScript. y el estilo adentro del codigo HTML. que para mi es ensuciarlo.... es mejor practica trabajar las hojas de estilo y los javascripts en archivos separados... es mas eficiente a la hora de hacer algun cambio a un sitio pues vas directo al archivo. Y adicionalmente la funcion la haces Reutilizable. en cambio asi. tendrias que copiar el codigo en cada lugar que lo necesites...!!!!

memoadian · #8 (**permalink**) 06/06/2011, 11:32

como dice rjulio21, si lo trabajas con funciones ensucias menos tu código html y se hace menos tedioso.

stramin · #9 (**permalink**) 06/06/2011, 12:13

concuerdo con ustedes, PERO si es un código que no se va a reutilizar no vale la pena, usar archivos independientes no solo es mas espacio en el disco si no que también retarda la página ya que en vez de abrir un solo archivo abren 3 (php, js, css).

no vale la pena hacer funciones si no se va a reutilizar, solo se alarga mas el código, la gente esta acostumbrada a trabajar así por que es como está en todas las guías y manuales y otros aportes en internet...

también recuerden que HTML esta hecho para trabajar con javascript, para eso existen los eventos de los tags como onclick, onload, etc, y javascript esta hecho para poder editar los estilos css, por esto viene con la función "style".

entonces, si existen para ser usados de esta manera por que no? XD

es mas eficiente por todos lados, ahorra tiempo, código, energía, archivos, tamaño...

no es que se ensucie, es que no están acostumbrados a verlo de esa manera :)

memoadian · #10 (**permalink**) 06/06/2011, 12:19

pero, en un entorno web nunca se sabe cuando se va a reutilizar una función, y si hablamos de un display:none, display:block casi seguro que se vuelve a usar, además aunque no sea código reutilizado debe haber un archivo con todas las funciones javascript, de todos modos la vas a cargar igual que el css.

todo esto aunado a las recomendaciones de la W3C.

el desarrollo web de hoy va orientado a dividirlo todo, POO, MVC etc. etc.

rjulio21 · #11 (**permalink**) 06/06/2011, 12:30

JavaScript no esta hecho para trabajar con CSS. Simplemente Tiene la potencia de Manejar todo el DOM de la pagina. y eso incluye las propiedades de los objetos... Que con CSS AHORA se puedan modificar tales propiedades es otro ASUNTO.....!!!! y Bueh. Es cuestion de Trabajar limpio y ahorrarte tiempo... Normalmente uno desarrolla para las demas personas, y las demas personas NORMALMENTE quieren cambios. Cuando Hay cambios y todo el codigo esta junto. alli esta el problema. En fin. es decision de cada quien. HerbyBocho. Espero te sirva. De ambas formas funciona. es tu decision. jaja. buenas tardes...