• Publicidad

CGI y JavaScript

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

CGI y JavaScript

Notapor thegame » 2011-11-30 10:40 @486

Hola, tengo un formulario hecho con CGI y hay 2 popup_menu pero quiero que cuando haga clic en uno, tome ese valor para poder mostrar en el otro popup_menu muestre los valores de acuerdo a lo que yo elegí en el primero.

Entonces leyendo por Internet leí que con el onchange() tengo que hacerlo con JavaScript, por lo tanto tengo las siguientes preguntas:

1.- ¿Hay una forma de hacer que funcione el onchange() utilizando Perl? ¿cómo es?
2.- No sé de JavaScript con Perl, en el código (que está más abajo) ¿estoy colocándolo bien? Lo hice de dos formas; una que vi con el cgi y otra colocando entre <script> </script> el código. ¿Cuál de las dos formas es la correcta?
3.- Es con respecto al código de JavaScript, cuando hago el return ¿a dónde me devuelve eso?

Una vez más, gracias por la ayuda que me puedan dar.

Sintáxis: [ Descargar ] [ Ocultar ]
Using perl Syntax Highlighting
  1. #!/usr/bin/perl
  2. binmode STDOUT, ":encoding(ISO-8859-1)";
  3. use CGI;
  4. use CGI::Carp qw(fatalsToBrowser);
  5. use Mod_dir::buscar;
  6. #use strict;
  7. #use warnings;
  8. print error;
  9.  
  10. <script type="text/javascript" language="javascript">
  11. function jsopt(institucion){
  12.    document.getElementById("institucion").innerHTML;
  13.    return;
  14. }
  15. </script>
  16.  
  17. my $inst=buscar->new;
  18. my @ins=@{$inst->llamar_inst};
  19.  
  20.  
  21. my $sed=buscar->new;
  22. my @sede=@{$sed->llamar_sede};
  23.  
  24. my $q = new CGI;
  25. #print $query->start_html(-script=>[{ -type => 'text/javascript', -src => '../../getlink.js'}]);
  26. print $q->header;
  27. print $q->startform;
  28. print $q->p('Institucion:'.$q->popup_menu({-name=>'institucion', -values=>\@ins, -OnClick=>jsopt(this)});
  29. print $q->p('Sede:'.$q->popup_menu({-name=>'sede', -values=>\@sede}));
  30. print $q->p('Cédula:'.$q->textfield({-name=>'cedula'}));
  31. print $q->p('Nombre:'.$q->textfield({-name=>'nombre'}));
  32. print $q->p('Apellido:'.$q->textfield({-name=>'apellido'}));
  33. print $q->p('Email:'.$q->textfield({-name=>'email'}));
  34. print $q->p('Teléfono:'.$q->textfield({-name=>'tlf'}));
  35. print $q->p('Fax:'.$q->textfield({-name=>'fax'}));
  36. print $q->p('Celular:'.$q->textfield({-name=>'cel'}));
  37. print $q->p('Cargo:'.$q->textfield({-name=>'cargo'}));
  38. print $q->submit({-value=>'Guardar'});
  39. print $q->reset({-value=>'Borrar Formulario'})."<br>";
  40. #print "Institución".$query->optgroup(-name=>'Institución', -values => [$traer[0]]);
  41. print $q->end_form;
  42. #print $query->end_html();
  43.  
Coloreado en 0.005 segundos, usando GeSHi 1.0.8.4
thegame
Perlero nuevo
Perlero nuevo
 
Mensajes: 38
Registrado: 2011-11-08 11:19 @513
Ubicación: Venezuela

Publicidad

Re: CGI y JavaScript

Notapor explorer » 2011-11-30 11:23 @516

A ver... hay que tener algunos conceptos claros...

El JavaScript se ejecuta en el cliente, así que no se puede ejecutar en el CGI, que está en el lado del servidor. Entonces, no se puede ejecutar ningún evento JavaScript desde Perl. Hay que saber dónde se está ejecutando qué código en qué momento y en qué lugar.

El return del JavaScript devuelve al control al punto del código JavaScript dentro del código HTML que lo llamó.

Ese código debe viajar con el resto del código HTML que el programa Perl envía al cliente. Como la generación del código HTML lo estás haciendo con el módulo CGI, hay que usar sus funciones para agregar el código JavaScript, que, normalmente, irá en la sección <head>.

Según el manual de CGI, para poder enviar un <head> personalizado hay que hacer algo como esto (sacado del manual y ajustado a tu código):

Sintáxis: [ Descargar ] [ Ocultar ]
Using perl Syntax Highlighting
  1. my $codigo_javascript = <<EOC
  2. function jsopt(institucion){
  3.    document.getElementById("institucion").innerHTML;
  4.    return;
  5. }
  6. EOC
Coloreado en 0.001 segundos, usando GeSHi 1.0.8.4
Sintáxis: [ Descargar ] [ Ocultar ]
Using perl Syntax Highlighting
  1. print $q->start_html(
  2.     -title  => 'Prueba con Select',
  3.     -script => $codigo_javascript,
  4. );
Coloreado en 0.001 segundos, usando GeSHi 1.0.8.4

Como ves, hay que iniciar el HTML, pero indicando que vamos a usar un trozo de código en JavaScript. El módulo CGI se ocupará de colocarlo en su sitio, en la cabecera (más información en la sección CREATING THE HTML DOCUMENT HEADER).

Luego está el tema de que, cada vez que el usuario hace una elección, la página se redibuja (es una petición HTTP completa), por lo que el CGI debe redibujar toda la página, y recordar el estado de los controles de los formularios, en cada petición.

Otra opción es usar la técnica de Ajax. En estos mismos foros tienes un hilo y ejemplo completo sobre el tema.
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 y JavaScript

Notapor thegame » 2011-12-01 08:32 @397

¡Ah, ok! Gracias por la respuesta. Otra cosa era que quería colocarle CSS al formulario hecho con CGI, entonces investigando en perldoc-cgi leí que en el start_html coloco la dirección del archivo de CSS y luego para colocar el CCS en alguna parte de la página lo agrego con la etiqueta class. ¿Es correcto?

Yo intenté algo así:
Sintáxis: [ Descargar ] [ Ocultar ]
Using perl Syntax Highlighting
  1. print start_html(-title=>'Titulo',-style=>{'src'=>'/archivo.css'})
  2. .
  3. .
  4. .
  5. .
  6. print $q->p('Nombre:'.$q->textfield({-class=>'ejemplocss',-name=>'nombre'}));
  7.  
Coloreado en 0.001 segundos, usando GeSHi 1.0.8.4


¿Está bien así? Porque no me hace los cambios al meter el CSS...
thegame
Perlero nuevo
Perlero nuevo
 
Mensajes: 38
Registrado: 2011-11-08 11:19 @513
Ubicación: Venezuela

Re: CGI y JavaScript

Notapor explorer » 2011-12-01 11:53 @537

Pues yo lo veo bien... Te falta solo poner algo de texto en el campo de texto, pero... está bien...

Bueno... no... usas start_html() de forma directa, y luego usas el objeto $q... deberías usar solo un método...

¿El servidor web dice que ha servido el fichero .css al cliente?
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 y JavaScript

Notapor thegame » 2011-12-05 09:26 @434

Disculpa, explorer, no entendí la pregunta que me hiciste. ¿Puedes explicarte mejor? Gracias.
thegame
Perlero nuevo
Perlero nuevo
 
Mensajes: 38
Registrado: 2011-11-08 11:19 @513
Ubicación: Venezuela

Re: CGI y JavaScript

Notapor explorer » 2011-12-05 11:33 @523

Perdón. Se me coló una 'r' (¿Ves lo importante que es prestar atención a lo que se escribe, incluso a una sola letra?)

Me refería a que miraras los archivos de registro de actividad (log) del servidor web, para que vieras si, efectivamente, el servidor web ha servido el fichero css, 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 y JavaScript

Notapor thegame » 2011-12-19 10:46 @490

explorer, sabes que estaba revisando el código que me distes para lo del JavaScript y cuando veo el código fuente de la página me aparece esto:

Sintáxis: [ Descargar ] [ Ocultar ]
Using html4strict Syntax Highlighting
  1. <!DOCTYPE html
  2.         PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  3.          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml" lang="en-US" xml:lang="en-US">
  5. <head>
  6. <title>Formulario Usuario</title>
  7. <link rel="stylesheet" type="text/css" href="../../Css/style_formulario.css" />
  8. <script type="text/javascript">//<![CDATA[
  9. function combo{
  10. document.form.getElementById("institucion").innerHTML;
  11. return;
  12. }
  13.  
  14. function validar{
  15. if (document.form.nombre.value.length==0){
  16.       alert("Tiene que Escribir un Nombre")
  17.       document.form.nombre.focus()
  18.       return 0;
  19. }
  20.  
  21. //]]></script>
  22. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  23. </head>
  24. <body>
  25.  
Coloreado en 0.002 segundos, usando GeSHi 1.0.8.4


Vi este <![CDATA ... y dentro estaba el JavaScript. Ahora me puse a investigar en Internet y leí que todo lo que estaba dentro del CDATA lo lee como texto plano, entonces por eso creo que por eso no me ejecuta el código, corrígeme si me equivoco... y he intentado varias cosas para ver cómo lo arreglo pero igual sigue ahí, entonces como tu me ayudaste con ese código quisiera saber cómo puedo arreglarlo. Gracias...

NOTA: Estoy usando el código que me indicaste:
Sintáxis: [ Descargar ] [ Ocultar ]
  1. my $codigo_javascript = <<EOC 
  2. function jsopt(institucion){ 
  3. document.getElementById("institucion").innerHTML; 
  4. return; 
  5. EOC 
thegame
Perlero nuevo
Perlero nuevo
 
Mensajes: 38
Registrado: 2011-11-08 11:19 @513
Ubicación: Venezuela

Re: CGI y JavaScript

Notapor explorer » 2011-12-19 11:23 @516

Fíjate que el <![CDATA[ y su correspondiente cierre ]]> están comentados (tienen un '//' delante de ellos), por lo que no son visibles para el motor de 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


Volver a Web

¿Quién está conectado?

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