• Publicidad

CGI con DIV oculto

Todo lo relacionado con el desarrollo Web con Perl: desde CGI hasta Mojolicious

CGI con DIV oculto

Notapor gonzalos » 2011-08-19 07:11 @341

Buenas tardes.

Como proyecto tengo que hacer un CGI, en el que al pulsar sobre un enlace se despliegue una descripción del mismo. Pensaba hacerlo a través de un DIV oculto. Además, al lado del enlace sería recomendable que apareciera un botón que, al pincharlo, te llevara a la página relacionada.

Los datos que aparecerían en el CGI, estarían en una BBDD MySQL. Para ir trabajando, de forma local, me he instalado el paquete XAMPP.

Por ahora lo que he conseguido es conectarme a la BBDD y presentarlo en un HTML. Para mí ahora viene lo difícil, que sería definir cómo incrusto el DIV en el código y cómo enlazo a las distintas páginas donde estaría toda la información completa.

Un saludo
Gonzalo
gonzalos
Perlero nuevo
Perlero nuevo
 
Mensajes: 77
Registrado: 2009-11-27 05:47 @283

Publicidad

Re: CGI con DIV oculto

Notapor gonzalos » 2011-08-26 04:38 @235

Buenos días a todos

Aquí está el código, si no añado el DIV, funciona bien, pero con el DIV me aparece un problema al ejecutarlo.
Sintáxis: [ Descargar ] [ Ocultar ]
Using perl Syntax Highlighting
  1. #!c:/xampp/perl/bin/perl.exe
  2. use strict;
  3. use warnings;
  4. use CGI qw/:standard/;
  5. use DBI;
  6.  
  7. my $dbh=DBI->connect("DBI:mysql:mysql;host=localhost",'','')
  8.         or die "Cannot connect to database:$DBI::errstr";
  9.        
  10. my $sth=$dbh->prepare("SELECT denominacion,grupo,explicacion FROM lineas ORDER BY grupo");
  11. $sth->execute() or die "Cannot execute sth:$DBI::errstr";
  12.  
  13. print header,
  14.          start_html ("RECETAS DE COCINA"),
  15.          table ({-border=>0});
  16.         while(my($denominacion,$grupo,$explicacion)=$sth->fetchrow_array()){
  17.                 if ($explicacion eq ""){
  18.                         $explicacion="<b> </b>";
  19.                 }
  20.                 print Tr({-aling=>'CENTER', -valing=>'TOP'},
  21.                         [td(["$denominacion","$grupo"])
  22.                         ]);
  23.                        
  24.                 print Div ({id=>"descripcion"},
  25.                 Tr({-aling=>'CENTER', -valing=>'TOP'},
  26.                 [td(["$explicacion"])
  27.                         ]),
  28.                 );     
  29.                 }
  30.                
Coloreado en 0.003 segundos, usando GeSHi 1.0.8.4


El error que me aparece en la consola es el siguiente:

Sintáxis: [ Descargar ] [ Ocultar ]
Using text Syntax Highlighting
Print () on unopened filehandle DIV at line 24
Coloreado en 0.000 segundos, usando GeSHi 1.0.8.4


Intentaré seguir buscando el error, a ver si puedo avanzar con el script.

Un saludo
Gonzalo
gonzalos
Perlero nuevo
Perlero nuevo
 
Mensajes: 77
Registrado: 2009-11-27 05:47 @283

Re: CGI con DIV oculto

Notapor explorer » 2011-08-26 04:54 @246

Cambia
Sintáxis: [ Descargar ] [ Ocultar ]
Using perl Syntax Highlighting
  1.                 print Div ({id=>"descripcion"},
Coloreado en 0.001 segundos, usando GeSHi 1.0.8.4
por
Sintáxis: [ Descargar ] [ Ocultar ]
Using perl Syntax Highlighting
  1.                 print div({id=>"descripcion"},
Coloreado en 0.001 segundos, usando GeSHi 1.0.8.4
JF^D Perl programming & Raku programming. Grupo en Telegram: https://t.me/Perl_ES
Avatar de Usuario
explorer
Administrador
Administrador
 
Mensajes: 14480
Registrado: 2005-07-24 18:12 @800
Ubicación: Valladolid, España

Re: CGI con DIV oculto

Notapor gonzalos » 2011-08-26 05:47 @283

Gracias, Explorer.

A veces con tanto signo de puntuación me pierdo, y se me van las cosas sencillas.

Ahora intentaré insertarle el JavaScript, para que al picar sobre la descripción me la muestre u oculte, a ver qué sale.

Un saludo
Gonzalo
gonzalos
Perlero nuevo
Perlero nuevo
 
Mensajes: 77
Registrado: 2009-11-27 05:47 @283

Re: CGI con DIV oculto

Notapor gonzalos » 2011-08-29 03:45 @198

Hola a todos

He estado buscando info en Internet de cómo incluir el JavaScript dentro del código cgi, y no existe mucha información al respecto. Revisando la info existente y teniendo en cuenta cómo debía ir el código de JavaScript que obtuve de la red. Esto es lo que puedo hacer.

Sintáxis: [ Descargar ] [ Ocultar ]
Using perl Syntax Highlighting
  1. print header;
  2. .
  3. .
  4. .
  5. print <<E_1;
  6. <script>
  7. function muestra_oculta(id){....................................
  8. if (document.getElementById){ //se obtiene el id
  9. var el = document.getElementById(id); //se define la variable "el" igual a nuestro div
  10. el.style.display = (el.style.display == 'none') ? 'block' : 'none'; //damos un atributo display:none que oculta el div
  11. }
  12. }
  13. window.onload = function(){/*hace que se cargue la función lo que predetermina que div estará oculto hasta llamar a la función nuevamente*/
  14. muestra_oculta('descripcion');/* "contenido_a_mostrar" es el nombre que le dimos al DIV */
  15. }
  16. </script>
  17. E_1
  18. ;
  19.          start_html ("RECETAS DE COCINA"),
  20. .
  21. .
  22. .
  23.  
Coloreado en 0.001 segundos, usando GeSHi 1.0.8.4


Y ésta es la parte del código que debería ir asociada al JavaScript

Sintáxis: [ Descargar ] [ Ocultar ]
Using perl Syntax Highlighting
  1. .
  2. .
  3. print
  4.     Tr(
  5.         { -aling => 'CENTER', -valing => 'TOP' },
  6.         [
  7.             td([
  8.                 a(
  9.                     { -href => "#", Onclick => "muestra_oculta('descripcion')" },
  10.                     "$denominacion"
  11.                 ),
  12.                 "$grupo"
  13.             ]),
  14.         ]
  15.     );
  16. print
  17.     div(
  18.         { id => "descripcion" },
  19.         Tr(
  20.             { -aling => 'CENTER', -valing => 'TOP' },
  21.             [
  22.                 td([
  23.                     "$explicacion"
  24.                 ])
  25.             ]
  26.         ),
  27.     );
  28. .
  29. .
  30. .
  31.  
Coloreado en 0.001 segundos, usando GeSHi 1.0.8.4


¿Alguna idea de cuál es el motivo por el que no funciona, o es que estoy haciendo algo mal y no me he dado cuenta?

Un saludo
Gonzalo
gonzalos
Perlero nuevo
Perlero nuevo
 
Mensajes: 77
Registrado: 2009-11-27 05:47 @283

Re: CGI con DIV oculto

Notapor explorer » 2011-08-29 12:53 @578

Te falta un print() en el start_html(). Además, puedes usar la facilidad de CGI.pm para meter el código JavaScript. Algo así (no probado):

Sintáxis: [ Descargar ] [ Ocultar ]
Using perl Syntax Highlighting
  1. my $codigo_js = << EOJ;
  2. function muestra_oculta(id) {
  3.     if (document.getElementById){             // se obtiene el id
  4.         var el = document.getElementById(id); // se define la variable "el" igual a nuestro div
  5.                                               // damos un atributo display:none que oculta el div
  6.         el.style.display = (el.style.display == 'none') ? 'block' : 'none';
  7.     }
  8. }
  9. window.onload = function() {
  10.     // hace que se cargue la función
  11.     // lo que predetermina que div estará oculto hasta llamar a la función nuevamente
  12.     // "contenido_a_mostrar" es el nombre que le dimos al DIV
  13.     muestra_oculta('descripcion');
  14. }
  15. EOJ
  16.  
  17. print header;
  18. print start_html(
  19.      -title  => 'RECETAS DE COCINA',
  20.      -script => $codigo_js,
  21. );
  22.  
Coloreado en 0.001 segundos, usando GeSHi 1.0.8.4
JF^D Perl programming & Raku programming. Grupo en Telegram: https://t.me/Perl_ES
Avatar de Usuario
explorer
Administrador
Administrador
 
Mensajes: 14480
Registrado: 2005-07-24 18:12 @800
Ubicación: Valladolid, España

Re: CGI con DIV oculto

Notapor gonzalos » 2011-08-30 03:19 @180

Hola a todos

He hecho el cambio y me aparece nuevo error. La función no se ejecuta correctamente, es decir, el div no se oculta y cuando picas sobre el enlace aparece el siguiente error:

Sintáxis: [ Descargar ] [ Ocultar ]
Using text Syntax Highlighting
Objeto no encontrado: El enlace requerido no ha sido localizado en este servidor. El enlace en la página referente parece tener algun error o ha expirado.
Coloreado en 0.000 segundos, usando GeSHi 1.0.8.4


El script, está en un servidor local, y las modificaciones las realizo sobre el script que está en la carpeta cgi-bin.

Seguiré trasteando a ver si doy con la solución.

Un saludo
Gonzalo
gonzalos
Perlero nuevo
Perlero nuevo
 
Mensajes: 77
Registrado: 2009-11-27 05:47 @283

Re: CGI con DIV oculto

Notapor explorer » 2011-08-30 05:59 @291

La parte del código que genera el código HTML también está mal, o sobran cosas:

* Un Tr() es una fila de una tabla (<table>) por lo que debe estar dentro de una tabla
* No es 'aling' ni 'valing', sino 'align' y 'valign'
* Si dentro de una celda o una fila solo hay un elemento, no es necesario definir el contenido como arrays anónimos. Tampoco pasa nada si de deja así, desde luego
* A Onclick le falta el '-' delante
* Cuando quieres pasar una variable como dato, no es necesario ponerla entre comillas dobles, como el caso de "$denominacion", "$grupo" y "$explicacion". Con solo poner $denominacion, $grupo y $explicacion, ya es suficiente.

Quedaría algo así (no probado):
Sintáxis: [ Descargar ] [ Ocultar ]
Using perl Syntax Highlighting
  1. print
  2.     table(
  3.         Tr({ -align => 'center', -valign => 'top' }, [
  4.             td([
  5.                 a({ -href => "#", -Onclick => "muestra_oculta('descripcion')" }, $denominacion),
  6.                 $grupo,
  7.             ]),
  8.         ]),
  9.     );
  10.  
  11. print
  12.     div({ id => "descripcion" },
  13.         table(
  14.             Tr({ -align => 'center', -valign => 'top' }, [
  15.                 td([
  16.                     $explicacion,
  17.                 ]),
  18.             ]),
  19.         ),
  20.     );
  21.  
Coloreado en 0.001 segundos, usando GeSHi 1.0.8.4

Te recomiendo que compruebes el código HTML una vez que ha sido generado, en el navegador web, para ver si es correcto o no.
JF^D Perl programming & Raku programming. Grupo en Telegram: https://t.me/Perl_ES
Avatar de Usuario
explorer
Administrador
Administrador
 
Mensajes: 14480
Registrado: 2005-07-24 18:12 @800
Ubicación: Valladolid, España

Re: CGI con DIV oculto

Notapor gonzalos » 2011-08-30 09:26 @434

Hola Explorer

Gracias por la ayuda.

La instrucción para la creación de la tabla (Table), la incluí después de start_html, porque quería que la tabla se fuera generando dinámicamente a la vez que el bucle fuera leyendo los datos de la BBDD, o al menos eso decía el material que consulté.

He modificado lo que me comentas y sigue sin ejecutarse la llamada al evento Onclick. Además he revisado el html que se genera y es correcto.

Hay una cosa que no entiendo, de la parte del script que publicaste, y es el "código" que aparece antes de la función javascript, dentro del evento, (..javascript:muestra...).

¿Se utilizaría cuando se hace la llamada a la función usando el escalar $jscript?

Seguiré peleando con el código.

Un saludo
Gonzalo
gonzalos
Perlero nuevo
Perlero nuevo
 
Mensajes: 77
Registrado: 2009-11-27 05:47 @283

Re: CGI con DIV oculto

Notapor explorer » 2011-08-30 09:42 @446

Hay un error en el código que te he puesto: sobra el "javascript:".

Lo que hice fue meter todo el código JavaScript, como si fuera un texto, dentro del escalar $codigo_js. Luego, con el print del start_html(), ese código sale hace la página (que se colocará en el <head> del HTML).

Quien va a ejecutar el código JavaScript es el usuario del navegador web, al hacer el clic sobre el enlace.

Para estar seguros, mira a ver la consola de errores (menú Herramientas del Firefox) para que te saque los errores JavaScript, y así sabrás si es un problema del HTML o del código JavaScript.
JF^D Perl programming & Raku programming. Grupo en Telegram: https://t.me/Perl_ES
Avatar de Usuario
explorer
Administrador
Administrador
 
Mensajes: 14480
Registrado: 2005-07-24 18:12 @800
Ubicación: Valladolid, España

Siguiente

Volver a Web

¿Quién está conectado?

Usuarios navegando por este Foro: No hay usuarios registrados visitando el Foro y 0 invitados