Re: CGI question: elegant way to have three form image buttons doing different things?

Have your image submits with the same name and place a value:


<input type="image" name="action" value="invite" alt="Invite" src="inv
+ite.gif">
<br>
<input type="image" name="action" value="view" alt="View Results" src=
+"view.gif">
<br>
<input type="image" name="action" value="leave" alt="Leave" src="exit.
+gif">
[download]

then you test that value in your script:


my $action = $cgi->param('action');
if ($action eq 'invite') {
  # invite code
} elsif ($action eq 'view') {
  # view
...
..
[download]

He who asks will be a fool for five minutes, but he who doesn't ask will remain a fool for life.

Chady | http://chady.net/

Comment on Re: CGI question: elegant way to have three form image buttons doing different things? Select or Download Code

Replies are listed 'Best First'.
Re: Re: CGI question: elegant way to have three form image buttons doing different things? by t'mo (Pilgrim) on Sep 13, 2001 at 17:27 UTC
Nice. Giving the images the same name, and associating a value is probably the most "elegant" way. As an alternative to a series of `if...elsif...else` statements, you could also use a hash of acceptable action names, paired with a sub, e.g.: `my %actions = ( invite => sub { ... }, view => sub { ... }, leave => sub { ... }, ); my $action = $cgi->param('action'); $actions{$action}->() if exists $actions{$action};` [download] Update: ...except that from an HTML perspective, I don't think that using the same name for the input/image elements will work. According to the the HTML 4 standard, When a pointing device is used to click on the image, the form is submitted and the click coordinates passed to the server. The x value is measured in pixels from the left of the image, and the y value in pixels from the top of the image. The submitted data includes name.x=x-value and name.y=y-value where "name" is the value of the name attribute, and x-value and y-value are the x and y coordinate values, respectively. So, it looks like in the CGI script, you'd have to get the coordinates; you can't assign a value to that input/image element, since it acts like a submit button. So, we're probably again reduced to haveing to use separate names, and detecting the different names, or alternatively, knowing the coordinates that will be returned and detecting those. Or, like I mentioned before (and like wildooUK mentions below), use JavaScript. :-)	[reply] [d/l] [select]

Replies are listed 'Best First'.

Re: Re: CGI question: elegant way to have three form image buttons doing different things?
by t'mo (Pilgrim) on Sep 13, 2001 at 17:27 UTC

Nice. Giving the images the same name, and associating a value is probably the most "elegant" way.

As an alternative to a series of if...elsif...else statements, you could also use a hash of acceptable action names, paired with a sub, e.g.:

my %actions = (
  invite => sub { ... },
  view   => sub { ... },
  leave  => sub { ... },
);
my $action = $cgi->param('action');
$actions{$action}->() if exists $actions{$action};
[download]

Update:

...except that from an HTML perspective, I don't think that using the same name for the input/image elements will work. According to the the HTML 4 standard,

When a pointing device is used to click on the image, the form is submitted and the click coordinates passed to the server. The x value is measured in pixels from the left of the image, and the y value in pixels from the top of the image. The submitted data includes name.x=x-value and name.y=y-value where "name" is the value of the name attribute, and x-value and y-value are the x and y coordinate values, respectively.

So, it looks like in the CGI script, you'd have to get the coordinates; you can't assign a value to that input/image element, since it acts like a submit button. So, we're probably again reduced to haveing to use separate names, and detecting the different names, or alternatively, knowing the coordinates that will be returned and detecting those.

Or, like I mentioned before (and like wildooUK mentions below), use JavaScript. :-)

[reply]
[d/l]
[select]