SEOPerfectCart Articles

SEOPerfectCart Articles

June 24, 2008

Multiple html form image input submit buttons, IE and PHP

Filed by: alterego @ 1:02 pm PHP Toolbox 101

What is the underscore mean? In PHP code on request variables such as ($_GET and $_POST)?

When submitting a form, it is possible to use an image instead of the standard submit button with a tag like:

HTML

input type=”image” src=”image.gif” name=”foo”

When the user clicks somewhere on the image, the accompanying form will be transmitted to the server with two additional variables: foo.x and foo.y where x and y are the pixel coordinate values of where you clicked on the image. This can be used to form an image map.

Firefox will transmit foo.x foo.y and the value of foo

Internet Explorer will only transmit foo.x and foo.y

Because foo.x and foo.y would make invalid variable names in PHP, they are automatically converted to foo_x and foo_y.

Spaces in request variable names are also converted to underscores.

That is, the periods or spaces are replaced with underscores. So, you retrieve these variables like any other REQUEST variable on the following page or same page. For example, $_GET['foo_x'].

There is a technicality related to form submission if you use an image submit button. It is usually relevant only if you have several such buttons in one form.
When using image submit buttons, you need to use specifically different NAME attributes in order to be able to recognize in the form handler which button was clicked on.

In the following:

HTML

input type=”image” src=”image.gif” name=”foo” alt=”Search” title=”Search” value=”Search”

According to the HTML 4 specification, you can use the TITLE attribute for most elements (including input elements) to suggest an “advisory title”, i.e. additional information which might be optionally presented to the user, e.g. as a “tooltip” popup. Supported to the TITLE attribute was introduced in IE 4, and later some support has been added to other browsers too.

In the absence of a TITLE attribute, IE uses the ALT attribute for that purpose. It’s still a good idea to specify both, even if they have the same value.

The VALUE attribute, despite being syntactically valid, has no logical meaning in this context - note that it does not get transmitted in the form data set in IE { Internet Explorer }; but since some browsers use it, instead of ALT, for the alternative text, it is a good idea to include it too (with the same value as ALT)

In Mozilla / FireFox the attribute VALUE is transmitted as the value of the NAME variable. So if you are using PHP

HTML

input type=”image” src=”image.gif” name=”foo” value=”42″ alt=”Search” title=”Search”

PHP

echo $_GET['foo']; will echo the value of the NAME variable foo which in this case is

Mozilla will transmit:
$_GET['foo_x'] = lets say 5 (the x coordinate of where the image was clicked)
$_GET['foo_y'] = lets say 6 (the y coordinate of where the image was clicked)
$_GET['foo'] = The value of the VALUE attribute which in this case is 42

IE(Internet Explorer) will only transmit the x and y values
$_GET['foo_x'] = lets say 5 (the x coordinate of where the image was clicked)
$_GET['foo_y'] = lets say 6 (the y coordinate of where the image was clicked)

The values ALT, TITLE. These are used to help the visually impaired access your website. Some of you may scoff at this but be warned that some countries and states allow civil lawsuits for not providing reasonable access to the handicapped, so check yours. Section 508 of the Americans with Disabilities Act states that you must make it accessible.

The value of NAME is transmitted as either a $_GET or a $_POST ($_REQUEST variables) depending on what type of form it is.

I have been unable to find a way retrieve the value of the NAME atrribute with any consistency.
I found this as a comment on another site by a poster named Abalam that suggested if you send the value in the following format:

HTML

input type=”image” src=”image.gif” name=”foo[0]“ value=”42″ alt=”Search” title=”Search”

and attempt to retrieve it in PHP as follows:

PHP

foo_x and foo_y will still exist.

The following should be true:

$_GET["foo"][0]=”42″

or

$_POST["foo"][0] = “42″

it should work.

I have been unable to make this work! I have used print_r to display array $foo in Internet Explorer and it does not show any other values except for the x and y coordinates.

In mozilla it shows all the values.

The solution here is to get everyone you know to use Mozilla / FireFox and slam Microsoft Internet Explorer at every turn. When our Public companies do not serve the Public its time for a change.


Valid HTML 4.01 Transitional CSS_Validator Feed_Validator