Anonymous Monk has asked for the wisdom of the Perl Monks concerning the following question:

I need to update my array "@itmes2" if a user changes the value of "@items1". Is it possible to do it without javascript? If not how can I call an onChange event that updates a perl data structure? 
...
<tr>
    <td>
        Product
    </td>
    <td>
        <& .menu, name => 'items_1', values => \@items1 &>
    </td>
</tr>
<tr>
    <td>
        Product
    </td>
    <td>
        <& .menu, name => 'items_2', values => \@items2 &>
    </td>
</tr>
...

[download]
Thanks for any advice

Replies are listed 'Best First'.
Re: cgi and update event
by olus (Curate) on Mar 07, 2008 at 16:03 UTC

    HTML pages are static. Javascript makes them dynamic. So, you can't do it without javascript. I'm not familiar with that syntax, so you should look for ways that allow the construction of those .menu with additional attributes, other than name and values. Something like <& .menu, name => 'items_1', values => \@items1, other_attributes => "onChange = some_javascrit_code();" &>

[reply]
[d/l]
[select]

      To expand upon olus' explaination, the data structures that you have there get processed by Perl server side to produce the HTML. Once that HTML is sent to the user, it is just plain text being rendered by their browser, and the only way to do anything dynamic is with something client-side like Javascript.

      In addition to olus' solution, if you really want to do the processing grunt work in Perl and don't mind the slower user experience, you can write a relatively small amount of Javascript to re-query the server when a change is made.

[reply]
        Or, if you don't want to write the JavaScript yourself, you can use CGI::Ajax to handle the interfacing between the HTML/JavaScript page and your server-side Perl.
[reply]
Re: cgi and update event
by Anonymous Monk on Mar 07, 2008 at 19:48 UTC
    Using cgi::ajax this is what I have as my test script. I'm still not sure how I can update the contents of the second list box??? 
    #!C:/Perl/bin/perl.exe

use strict;
use warnings;

use CGI;
use CGI::Ajax;

my $cgi = new CGI;

my $pjx = new CGI::Ajax( 'update' => \&update_options,
                         'update2' => \&update_options2);

my @item1 = qw(1 2 3 4 5);
 
my $html = '<HTML>
<HEAD><title>CGI::Ajax Example</title>
</HEAD>
<BODY>';

$html .= '<SELECT name=\"TEST\" id="val1" onchange="update( [\'val1\',
+\'NO_CACHE\'], [\'resultdiv\'] );">\n';
$html .= populate_list_box(@item1);
$html .= "</SELECT><BR>\n";

$html .= '<div id="resultdiv"></div><hr>';

$html .= '<SELECT name=\"TEST\" id="val2" onchange="update2( [\'val2\'
+,\'NO_CACHE\'], [\'resultdiv2\'] );">\n';
$html .= populate_list_box(@item1);
$html .= "</SELECT><BR>\n";

$html .= '<div id="resultdiv2"></div>';

$html .= '
</BODY>
</HTML>';

print $pjx->build_html($cgi,$html);

sub populate_list_box {

    my @array = @_;

    my $htmlCode = "";

    foreach (@array) {
    my $selected = "";
    $htmlCode .= "<option value=\"$_\" $selected>$_</option>\n";
    }
    return $htmlCode;
}




sub update_options {

    my $input = shift;

    # Not sure what to do here in order to update the second array cho
+ices to: (10 11 12 13 14 15)

    return $input;
}

sub update_options2 {
    my $input = shift;

    return $input;
}

    [download]
    Thanks for the help
[reply]
[d/l]
Re: cgi and update event
by Anonymous Monk on Mar 07, 2008 at 20:06 UTC
    I hacked something together that does what I want, but I'm sure theres a more elegant solution. Please let me know. 
    #!C:/Perl/bin/perl.exe

use strict;
use warnings;

use CGI;
use CGI::Ajax;

my $cgi = new CGI;

my $pjx = new CGI::Ajax( 'update' => \&update_options,
                         'update2' => \&update_options2);

my @item1 = qw(1 2 3 4 5);
my @item2 = qw(1 2 3 4 5);
 
my $html = '<HTML>
<HEAD><title>CGI::Ajax Example</title>
</HEAD>
<BODY>';

$html .= '<div id="data1"><SELECT name=\"TEST\" id="val1" onchange="up
+date( [\'val1\',\'NO_CACHE\'], [\'data2\'] );">\n';
$html .= populate_list_box(@item1);
$html .= "</SELECT><BR></div>\n";

$html .= '<div id="resultdiv"></div><hr>';

$html .= '<div id="data2"><SELECT name=\"TEST\" id="val2" onchange="up
+date2( [\'val2\',\'NO_CACHE\'], [\'resultdiv2\'] );">\n';
$html .= populate_list_box(@item2);
$html .= "</SELECT><BR></div>\n";

$html .= '<div id="resultdiv2"></div>';

$html .= '
</BODY>
</HTML>';

print $pjx->build_html($cgi,$html);

sub populate_list_box {

    my @array = @_;

    my $htmlCode = "";

    foreach (@array) {
    my $selected = "";
    $htmlCode .= "<option value=\"$_\" $selected>$_</option>\n";
    }
    return $htmlCode;
}

sub update_options {

    my $input = shift;

    my @item2 = qw(11 12 13 14 15);
    my $html = '<SELECT name=\"TEST\" id="val2" onchange="update2( [\'
+val2\',\'NO_CACHE\'], [\'resultdiv2\'] );">\n';
    $html .= populate_list_box(@item2);
    $html .= "</SELECT><BR>\n";

    return $html;
}

sub update_options2 {
    my $input = shift;

    return $input;
}

    [download]
[reply]
[d/l]

Back to Seekers of Perl Wisdom