Foro - Perl en Español

La comunidad de programadores en Perl de habla hispana.
http://perlenespanol.com/foro/

Llenar varios inputs a partir de un option select

http://perlenespanol.com/foro/llenar-varios-inputs-a-partir-de-un-option-select-t9157.html

Página 1 de 1

Llenar varios inputs a partir de un option select

NotaPublicado: 2016-01-06 21:21 @931
por hugo11ab
¿Qué tal?, nuevamente solicitando de su gran apoyo.

El problema que tengo en que necesito llenar varios textbox a partir del valor de un option select. Para esto estoy usando JQuery y Ajax. He visto varios manuales de cómo hacerlo, he avanzado en una parte pero el problema que tengo es que no sé cómo regresar los valores para ubicarlos en los textbox correspondientes.

Desde este script tengo el option value (lo que no sé es cómo colocar los valores en las cajas nomCategoria y numBeneficiarios).

Sintáxis: [ Descargar ] [ Ocultar ]
Using perl Syntax Highlighting
  1. sub datosLaborales {
  2.     my (@categoria,%labCategorias);
  3.  
  4.     push @gerencias,"";
  5.     ($rs,$fetch)
  6.         = record(
  7.             db        => "consulta_ategorias",
  8.             tabla     => "categorias",
  9.             condicion => "order by 2",
  10.             campos    => "id,codigo",
  11.             visible   => "no"
  12.     );
  13.  
  14.     while($fetch->()) {
  15.         push @categorias,$$rs{id};
  16.         $labCategorias{$$rs{id}} = $$rs{codigo};
  17.     }
  18.  
  19.     my $tblCategorias
  20.         = new HTML::Table(
  21.             -rows    => 2,
  22.             -cols    => 2,
  23.             -border  => 0,
  24.             -bgcolor => 0,
  25.             -width   => "100%",
  26.             -spacing => 0,
  27.             -padding => 3,
  28.             -class   => "tabla_principal2"
  29.     );
  30.     $tblCategorias->setCell(2,1,
  31.         "<span class=negro>Seleccione la Categoria</span> <br/>"
  32.       . popup_menu(
  33.             -name      => 'categoria',
  34.             -id        => 'categoria',
  35.             -value     => [(@categorias)],
  36.             -labels    => {%labCategorias},
  37.             -default   => "",
  38.             -onKeyDown => 'javascript&#058; if (event.keyCode==13 || event.keyCode==9) handleEnter(this,event);',
  39.             -class     => 'estilopopup'
  40.         )
  41.     );
  42.     $tblCategorias->setCell(2,2,
  43.         "<span class=negro>Nombre de la Categoria</span> <br>"
  44.       . textfield(
  45.             -id        => 'nomCategoria',
  46.             -name      => 'nomCategoria',
  47.             -value     => "",
  48.             -class     => 'bloqueado2',
  49.             -size      => 40,
  50.             -maxlength => 40,
  51.             -onpaste   => "return false",
  52.             readOnly   => "true"
  53.         )
  54.     );
  55.     $tblCategorias->setCell(3,1,
  56.         "<span class=negro>Número de Beneficiarios</span> <br>"
  57.       . textfield(
  58.             -id        => 'numBeneficiarios',
  59.             -name      => 'numBeneficiarios',
  60.             -value     => "",
  61.             -class     => 'bloqueado2',
  62.             -size      => 25,
  63.             -maxlength => 10,
  64.             -onpaste   => "return false",
  65.             readOnly   => "true"
  66.         )
  67.     );
  68.     $tblCategorias->setColAlign(1,"LEFT");
  69.     $tblCategorias->setColAlign(2,"LEFT");
  70.  
  71.     do "menu.cgi";
  72.     my $diseno = &obten_menuPrincipal($tblCategorias);
  73.  
  74.     print $session->header;
  75.     print start_html(
  76.         -title  => 'CATEGORIAS',
  77.         -script => [
  78.             #{ -language => 'JavaScript', -src =>'../../mnj_categoria/js/jquery-1.11.2.min.js'},
  79.             { -language => 'JavaScript', -src => 'http://code.jquery.com/jquery-1.11.3.min.js'},
  80.             { -language => 'JavaScript', -src => '../../mnj_categoria/js/jquery-ui-1.10.4.custom.min.js'},
  81.             { -language => 'JavaScript', -src => '../../mnj_categoria/js/valCategoria.js'}                            
  82.         ],
  83.         -style  => [
  84.             { -src => $server . '/mnj_categoria/css/principal.css'},
  85.         ],
  86.     );
  87.  
  88.     print start_multipart_form(
  89.         -action => $script_name,
  90.         -name   => 'form',
  91.         -id     => 'form'
  92.     );
  93.     print $diseno;
  94.     print end_form();
  95.     print end_html();
  96.  
  97.     exit;
  98. }
Coloreado en 0.004 segundos, usando GeSHi 1.0.8.4


Este es el JavaScript donde estoy efectuando la llamada del Ajax:

Sintáxis: [ Descargar ] [ Ocultar ]
Using javascript Syntax Highlighting
  1. $(document).ready(function (){
  2.    
  3.    $("#categoria").change( function(){   
  4.       var id= $("#categoria").val();
  5.           var url ="obtenValCategorias.cgi";
  6.           $.ajax({
  7.                  type:'POST',
  8.                  url:url,
  9.                  data:'id='+id,
  10.                  success:function(data){                         
  11.                          //es en esta parte como poner los valores en sus respectivas cajas
  12.                          $("#nomCategoria").html(data);
  13.                          $("#numBeneficiarios").html(data);
  14.                  }
  15.           });    
  16.           return false;  
  17.    });
  18. });
Coloreado en 0.001 segundos, usando GeSHi 1.0.8.4


Este es el código de obtenValCategorias.cgi
Sintáxis: [ Descargar ] [ Ocultar ]
Using perl Syntax Highlighting
  1. #!/usr/bin/perl -w
  2. BEGIN{ @INC=(@INC,"/var/www/cgi-bin/comun"); }
  3.  
  4. use mnj_plantilla;
  5. use strict;
  6.  
  7. &buscaCategoria();  
  8. exit;
  9.  
  10. sub buscaCategoria {
  11.     my($nombre,$beneficiarios);
  12.  
  13.     ($rs,$fetch)
  14.         = record(
  15.             db        => "consulta_ategorias",
  16.             tabla     => "categorias",
  17.             condicion => "WHERE id=$FORM{id}",
  18.             campos    => "nombre,beneficiarios",
  19.             visible   => "no"
  20.     );
  21.  
  22.     while($fetch->()) {
  23.         $nombre        = $$rs{nombre};
  24.         $beneficiarios = $$rs{beneficiarios};
  25.     }
  26.  
  27.     print $session->header;
  28.     print start_html(
  29.         -title  => 'CATEGORIAS',
  30.         -script => [
  31.                    ],
  32.         -style  => [
  33.                    ],
  34.     );
  35.  
  36.     # el nombre y el beneficiario sí los obtengo,
  37.     # pero no sé cómo regresar los valores para que estos se procesen
  38.     # y caigan en sus respectivas cajas de texto
  39.     print $nombre,$beneficiarios;
  40. }
Coloreado en 0.001 segundos, usando GeSHi 1.0.8.4


Espero y puedan ayudarme y de antemano muchas gracias.

Re: Llenar varios inputs a partir de un option select

NotaPublicado: 2016-01-07 03:38 @193
por explorer
Debes componer la respuesta de una manera que luego, en el código JavaScript, puedes extraer, y colocar el contenido de cada control.

Una forma moderna para hacerlo es codificar la información en JSON, ya que luego es fácil de extraer con el JavaScript. Pero lo puedes resolver incluso con una sola cadena de caracteres, unidos los dos campos con un carácter especial, por ejemplo, '|'. Y luego hacer un split en el lado del JQuery.

Re: Llenar varios inputs a partir de un option select

NotaPublicado: 2016-01-07 14:25 @642
por hugo11ab
Muchas gracias, explorer, ya quedó solucionado.

Así quedó el JavaScript:
Sintáxis: [ Descargar ] [ Ocultar ]
Using javascript Syntax Highlighting
  1. $(document).ready(function (){
  2.    
  3.    $("#categoria").change( function(){  
  4.           var id= $("#categoria").val();
  5.           var url ="obtenValCategorias.cgi";
  6.           $.ajax({
  7.                  type:'POST',
  8.                  url:url,
  9.                  data:'id='+id,
  10.                  success:function(data){                        
  11.                          var resultado = data.split('|');
  12.                          $("#nomCategoria").value(resultado[0]);
  13.                          $("#numBeneficiarios").value(resultado[1]);
  14.                  }
  15.           });    
  16.           return false;  
  17.    });
  18. });
Coloreado en 0.001 segundos, usando GeSHi 1.0.8.4

Así quedó el cgi:
Sintáxis: [ Descargar ] [ Ocultar ]
Using perl Syntax Highlighting
  1. #!/usr/bin/perl -w
  2. BEGIN{ @INC=(@INC,"/var/www/cgi-bin/comun"); }
  3.  
  4. use mnj_plantilla;
  5. use strict;
  6.  
  7. &buscaCategoria();  
  8. exit;
  9.  
  10. sub buscaCategoria {
  11.     my($nombre,$beneficiarios);
  12.  
  13.     ($rs,$fetch)
  14.         = record(
  15.             db        => "consulta_ategorias",
  16.             tabla     => "categorias",
  17.             condicion => "WHERE id=$FORM{id}",
  18.             campos    => "nombre,beneficiarios",
  19.             visible   => "no"
  20.     );
  21.  
  22.     while($fetch->()) {
  23.         $nombre        = $$rs{nombre};
  24.         $beneficiarios = $$rs{beneficiarios};
  25.     }
  26.     my $resultado = $nombre ."|".$beneficiarios;
  27.     print $session->header;
  28.     print $resultado;
  29. }
Coloreado en 0.002 segundos, usando GeSHi 1.0.8.4
Todos los horarios son UTC - 6 horas [ DST ]
Página 1 de 1
Powered by phpBB® Forum Software © phpBB Group
https://www.phpbb.com/