![]() |
|
|
|
|
|||||||
| Forums | Portal | Register | Rules & FAQ | Contribute | Members List | Arcade | Search | Today's Posts | Mark Forums Read |
| Shell Programming and Scripting Post questions about KSH, CSH, SH, BASH, PERL, PHP, SED, AWK and OTHER shell scripts here. |
|
|
||||
| Thread | Thread Starter | Forum | Replies | Last Post |
| Drop a Column from a File | Raamc | UNIX for Dummies Questions & Answers | 4 | 01-09-2008 06:36 AM |
| Drop records with non-numerics in field X | akxeman | Shell Programming and Scripting | 3 | 08-14-2007 09:55 PM |
| Drop down menu in bash for timezone select | simonb | Shell Programming and Scripting | 1 | 04-29-2006 10:02 AM |
| Drop Users | trfrye | UNIX for Dummies Questions & Answers | 2 | 08-31-2005 12:39 PM |
| text boxes, radio buttons , check boxes in c++ on unix | devy8 | High Level Programming | 3 | 07-07-2001 02:58 AM |
|
|
LinkBack | Thread Tools | Display Modes |
|
|||
|
Dynamic Drop down boxes
Hello All,
I am trying to come up with this interface with the backend on perl. The interface needs drop down boxes with dynamic chain loading ( as in contents of the 1st drop down box will populate the second drop down and so on) Any idea how I can do this? Kindly help Regards, Garric |
| Forum Sponsor | ||
|
|
|
|||
|
Use HTML with a single form element embracing all your drop downs ("select"s). You may need some Javascript to initiate script-triggered form submit when user changes the dropdown selection. As the form submission takes place, it will be received by Web server and the form processor is presumably a CGI script which receives the form parameters, re-generate the HTML to highlight the selected option and present an updated view based on what is selected. This CGI script can be written in Perl and executed from a CGI-enabled Web server.
If you understand HTML form processing and CGI, this should be a pretty straightforward task. Otherwise, please do some reading on this (i.e. HTML forms and Perl CGI scripting), as we cannot cover so much knowledge with such a tiny space here. |
|
|||
|
Javascript is just embedded in HTML (or in a separate .js file linked from the HTML, as I normally prefer), so your CGI just output the "script" element like normal plain text with Perl/CGI.
Javascript is the language you write your client-side scripts, but to access the objects on the HTML document (such as form controls) you will need to do so through the Javascript binding of DOM. You will need to set Javascript event handlers to capture selection change event of dropboxes. Official advise starts here: javascript: JavaScript - MDC DOM: DOM - MDC |
|
|||
|
This is the simplest example. Save it as "testdropbox.pl":
Code:
#!/usr/bin/perl -w
use CGI;
my $cgi = CGI->new();
print $cgi->header('text/html');
my %locations = (
'ca' => {
'desc' => 'Canada',
'cities' => {
'ca_to' => 'Toronto',
'ca_vc' => 'Vancouver',
},
},
'us' => {
'desc' => 'United States',
'cities' => {
'us_ny' => 'New York',
'us_sf' => 'San Francisco',
},
},
);
sub print_cty_dropbox {
my ($cty) = @_;
print qq|
<select id="cty" name="cty">
<option id="--" | . (!$cty?'selected="selected"':'') . qq|>Please choose country</option>|;
foreach (keys %locations) {
print qq|<option value="$_" | . (($cty && ($cty eq $_))?'selected="selected"':'') . qq|>${$locations{$_}}{desc}</option>\n|;
}
print "</select>\n";
}
sub print_city_dropbox {
my ($cty) = @_;
return if (!$cty);
print qq|
<select id="city" name="city">
<option id="--" selected="selected">Please choose city</option>|;
foreach (keys %{$locations{$cty}->{'cities'}}) {
print qq|<option value="$_">| . $locations{$cty}->{'cities'}{$_} . qq|</option>\n|;
}
print "</select>\n";
}
print qq|
<html>
<head>
<title>Dropbox Demo</title>
</head>
<body>
<form action="testdropbox.pl" method="post" id="tst">
<table><tr><td>
|;
print_cty_dropbox($cgi->param('cty'));
print qq|
</td><td>
|;
print_city_dropbox($cgi->param('cty'));
print qq|
</td></tr></table>
</form>
<script type="text/javascript"><!--
document.getElementById('cty').onchange = function() {
document.getElementById('tst').submit();
};
// --></script>
</body>
</html>
|;
|
|||
| Google UNIX.COM |