Ver Tema

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 · 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.

Syntax: [ Download ] [ Hide ]

Using perl Syntax Highlighting

#!c:/xampp/perl/bin/perl.exe
use strict;
use warnings;
use CGI qw/:standard/;
use DBI;
 
my $dbh=DBI->connect("DBI:mysql:mysql;host=localhost",'','')
        or die "Cannot connect to database:$DBI::errstr";
        
my $sth=$dbh->prepare("SELECT denominacion,grupo,explicacion FROM lineas ORDER BY grupo");
$sth->execute() or die "Cannot execute sth:$DBI::errstr";
 
print header,
         start_html ("RECETAS DE COCINA"),
         table ({-border=>0});
        while(my($denominacion,$grupo,$explicacion)=$sth->fetchrow_array()){
                if ($explicacion eq ""){
                        $explicacion="<b> </b>";
                }
                print Tr({-aling=>'CENTER', -valing=>'TOP'},
                        [td(["$denominacion","$grupo"])
                        ]);
                        
                print Div ({id=>"descripcion"},
                Tr({-aling=>'CENTER', -valing=>'TOP'},
                [td(["$explicacion"])
                        ]),
                );      
                }
                

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

Syntax: [ Download ] [ Hide ]

Using text Syntax Highlighting

Print () on unopened filehandle DIV at line 24

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

Un saludo
Gonzalo

explorer · 2011-08-26 04:54 @246

Cambia

Syntax: [ Download ] [ Hide ]

Using perl Syntax Highlighting

                print Div ({id=>"descripcion"},

por

Syntax: [ Download ] [ Hide ]

Using perl Syntax Highlighting

                print div({id=>"descripcion"},

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 · 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.

Syntax: [ Download ] [ Hide ]

Using perl Syntax Highlighting

print header;
.
.
.
print <<E_1;
<script>
function muestra_oculta(id){....................................
if (document.getElementById){ //se obtiene el id
var el = document.getElementById(id); //se define la variable "el" igual a nuestro div
el.style.display = (el.style.display == 'none') ? 'block' : 'none'; //damos un atributo display:none que oculta el div
}
}
window.onload = function(){/*hace que se cargue la función lo que predetermina que div estará oculto hasta llamar a la función nuevamente*/
muestra_oculta('descripcion');/* "contenido_a_mostrar" es el nombre que le dimos al DIV */
}
</script>
E_1
;
         start_html ("RECETAS DE COCINA"),
.
.
.
 

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

Syntax: [ Download ] [ Hide ]

Using perl Syntax Highlighting

.
.
print
    Tr(
        { -aling => 'CENTER', -valing => 'TOP' },
        [
            td([
                a(
                    { -href => "#", Onclick => "muestra_oculta('descripcion')" },
                    "$denominacion"
                ),
                "$grupo"
            ]),
        ]
    );
print
    div(
        { id => "descripcion" },
        Tr(
            { -aling => 'CENTER', -valing => 'TOP' },
            [
                td([
                    "$explicacion"
                ])
            ]
        ),
    );
.
.
.
 

¿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

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):

Syntax: [ Download ] [ Hide ]

Using perl Syntax Highlighting

my $codigo_js = << EOJ;
function muestra_oculta(id) {
    if (document.getElementById){             // se obtiene el id
        var el = document.getElementById(id); // se define la variable "el" igual a nuestro div
                                              // damos un atributo display:none que oculta el div
        el.style.display = (el.style.display == 'none') ? 'block' : 'none';
    }
}
window.onload = function() {
    // hace que se cargue la función
    // lo que predetermina que div estará oculto hasta llamar a la función nuevamente
    // "contenido_a_mostrar" es el nombre que le dimos al DIV
    muestra_oculta('descripcion'); 
}
EOJ
 
print header;
print start_html(
     -title  => 'RECETAS DE COCINA',
     -script => $codigo_js,
);
 

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:

Syntax: [ Download ] [ Hide ]

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.

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

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):

Syntax: [ Download ] [ Hide ]

Using perl Syntax Highlighting

print
    table(
        Tr({ -align => 'center', -valign => 'top' }, [
            td([
                a({ -href => "#", -Onclick => "muestra_oculta('descripcion')" }, $denominacion),
                $grupo,
            ]),
        ]),
    );
 
print
    div({ id => "descripcion" },
        table(
            Tr({ -align => 'center', -valign => 'top' }, [
                td([
                    $explicacion,
                ]),
            ]),
        ),
    );
 

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.

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

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.

gonzalos · 2011-08-30 09:52 @453

Parece ser que hay dos errores

El primero aparece al cargar la página

-

Syntax: [ Download ] [ Hide ]

Using text Syntax Highlighting

Error: syntax error

Archivo de origen: http://localhost/cgi-bin/lineas2.cgi

Línea: 9, columna: 28

Código fuente:

function muestra_oculta(id){....................................

y el segundo al intentar ejecutar el código JavaScript, si picamos sobre el enlace.

--

Syntax: [ Download ] [ Hide ]

Using text Syntax Highlighting

Error: muestra_oculta is not defined

Archivo de origen: http://localhost/cgi-bin/lineas2.cgi

Línea: 1

Antes de añadirlo al script, probé en HTML y funcionaba sin problemas.

Un saludo
Gonzalo

explorer · 2011-08-30 09:55 @455

gonzalos escribió:

Antes de añadirlo al script, probé en HTML y funcionaba sin problemas.

entonces... viendo las diferencias entre uno y otro, puedes ver qué es lo que sobra, lo que falta, o lo que está mal...

gonzalos · 2011-09-01 06:34 @315

Buenas tardes a todos

Finalmente he conseguido que funcione la aplicación, a excepción de una cosa y es que el Div que debería estar oculto aparece visible al cargar la página.

Además he hecho unas pequeñas modificaciones en el código, para que el el id del Div se asocie al id de la tabla de la BBDD y así el código javascript funcione independientemente con cada párrafo a ocultar.

Aquí dejo las modificaciones

Syntax: [ Download ] [ Hide ]

Using perl Syntax Highlighting

print table (
 
                    Tr({ -align => 'CENTER', -valign => 'top' }, [
                        td([
                            a({-href=>"#", -Onclick=>"muestra_oculta('$id')"},$denominacion),
                
                                $grupo]),
                    ]),
                );
           print div({id=>$id},
           
                  table (
 
                    Tr({ -align => 'CENTER', -valign => 'top' }, [
                        td([
                
                                $explicacion]),
                    ]),
                ), 
             ), 

Seguiré buscando para corregir el pequeño error que queda por solucionar.

Un saludo
Gonzalo

explorer · 2011-09-01 06:44 @322

Quizá sea tan sencillo como poner un display:none:

Syntax: [ Download ] [ Hide ]

Using perl Syntax Highlighting

print div({-id => $id, -style => 'display:none'},

gonzalos · 2011-09-01 07:06 @337

Estupendo, muchas gracias por la respuesta.

Un saludo
Gonzalo

Publicidad

Socializa