Tema: Ocultar un textarea
Ver Mensaje Individual
  #10 (permalink)  
Antiguo 07/05/2012, 17:18
Avatar de Briss
Briss
 
Fecha de Ingreso: junio-2011
Mensajes: 1.293
Antigüedad: 12 años, 10 meses
Puntos: 12
Respuesta: Ocultar un textarea
Cita:
Iniciado por emprear Ver Mensaje
Amiga, creo que te estás complicando la vida, lo que te puso furoya cumple con los objetivos.
De todas maneras, visualmente creo que es un error ocultar los detalles en caso de que haya hecho click en "SI", suponiendo por supuesto, que si elije "NO", no sea necesario que justifique, creo que visualmente esto sería mejor

Código HTML: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <title>encuesta más detalles</title> 
  6. <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  7.  
  8. <style type="text/css">
  9. /*<![CDATA[*/
  10.  
  11. /* estilos */ 
  12. .oculta{
  13. display: none;
  14. }
  15. /*]]>*/
  16. </style>
  17. <script type="text/javascript">
  18. //<![CDATA[
  19. function ocultar(ele){
  20. var tarea = document.getElementById('detalles_'+ele);
  21. tarea.style.display = 'none';
  22. tarea.value = '';
  23. }
  24. function mostrar(nele){
  25. var tarea = document.getElementById('detalles_'+nele);
  26. tarea.style.display = 'block';
  27. }
  28.  
  29. function verificar(){
  30. var d1= document.getElementById('detalles_p1').value;   
  31. var d2= document.getElementById('detalles_p2').value;       
  32. alert('Detalles pregunta 1:\n ' + d1 +'\nDetalles pregunta 2: \n' + d2 );
  33. }
  34. //]]>
  35. </script>
  36. </head>
  37. <body>
  38. <form action="#">
  39. <p>¿Está de acuerdo con la ley SOPA? --> <label for="p1">NO</label><input type="radio" value="no" id="p1" name="p1" onclick="ocultar(this.id)"/> 
  40. <label for="p1_s">SI</label><input type="radio" value="si" id="p1_s" name="p1" onclick="mostrar(this.name);" /> <br />
  41. <textarea name="detalles_p1"  id="detalles_p1" rows="2" cols="40" class="oculta"></textarea>
  42. </p>
  43. <p>¿Cree que los juegos olímpicos van a tener éxito? --> <label for="p2">NO</label><input type="radio" value="no" id="p2" name="p2" onclick="ocultar(this.id)"/> 
  44. <label for="p2_s">SI</label><input type="radio" value="si" id="p2_s" name="p2" onclick="mostrar(this.name);" /> <br />
  45. <textarea name="detalles_p2"  id="detalles_p2" rows="2" cols="40" class="oculta"></textarea>
  46. </p>
  47. <p>
  48. <input type="button" value="procesar encuesta" name="procesar" onclick="verificar();"/>
  49. </p>
  50. </form>
  51. </body>
  52. </html>

Si se agregan preguntas, basta utilizar 3, 4, 5 etc como substitución en los id y names de los elementos

Saludos

Gracias por la ayuda