The Test Environment for Cross Browser Compatibility - PHP

The following are the software, browser and application versions used to do cross browser testing:

Linux Environment

• XAMPP for Linux 1.7.3a in Ubuntu 9.10
  
• PHP Version 5.3.1
  
• Firefox version 3.6.12
  
• Google Chrome 8.0.552.215 beta

Windows Environment

• XAMPP for Windows Version 1.7.0 in Windows XP SP3
  
• PHP Version 5.2.8
  
• Firefox version 3.6.12
  
• Google Chrome 8.0.552.215
  
• Safari 5.0.3 (7533.19.4)
  
• Internet Explorer 8 (8.0.6001.18702)

This test uses POST in submitting form data. A test PHP script of these different methods was formulated and executed in a test server. You can download the test scripts here: http://www.php-developer.org/wp-content/uploads/scripts/formsubmission.zip

Do not run the test script in a production web server; it is only intended for local web server testing (e.g. in XAMPP). When you execute it in a test server, you will see this index page:

Those are links to the PHP script for testing the six methods. An "A" in the method, for example method1A and method2A, signifies that the HTML submit button uses the name attribute. "B" methods do not use the name attribute.

The test procedures are as follows:

Step 1. Click any method (for example, starting with method1A) in the table of contents.

Step 2. Fill in the web form and "CLICK" the submit button.

Step 3. Record the results. There are two possible results. The first is that the PHP script successfully processes the web form. The other result is no browser output from PHP form processing.

Step 4. Repeat the steps for all browsers and for all methods until they are all done.

Test Results

Below are the test results:

"No output" means that after the form was submitted, the form did not process the inputs, and therefore there was no output.

There are two columns of results. The first column shows what result was obtained when the web form was submitted by clicking the submit button. The second column shows what happened when pressing the enter key of the keyboard to submit the form to the server.

"Form submitted with output" means that the server successfully processed the inputs and provided the results back to the web browser.

In the above results, the yellow shaded rows are methods that are consistent regardless of whether the user used the submit button or pressed the enter key.

These are the methods that do not depend on the submit button name attribute. This means that the form will still work even if there is no name attribute, for example:

<input type="submit" value="Submit this form">

In the above results, there are three methods that were found to work in all browsers, operating systems tested and in PHP 5. These are: methods 3, 5, and 6. 

Peculiarity of Pressing Enter Key to Submit Web Form

After you fill out the form and then let the cursor stay on the last form text field, Google Chrome, Safari and Firefox will process the results after pressing the enter key. But these browsers will NOT submit results to the server if you let the cursor stay out of the form text box (especially if you click outside the text box field after filling it in). However, Internet Explorer will still submit the form after you press the Enter key, regardless of whether the cursor is inside or outside the last text box field.

Screen shot:

Final Recommendations

Based on the result, the recommended ways of checking to see if the web form has been submitted are the third and the fifth methods:

<?php
if (!isset($_POST['fieldname']))
{
//form is not submitted
?>
//Show HTML form
Enter text: <input name="fieldname" size="20">
<input type="submit" name="submit" value="Submit this form">
<?php
}
else
{
//form submitted
//do form processing and validation
}
?>

Fifth method:

<?php
if (!(array_key_exists('_submit_check',$_POST)))
{
//form is not submitted
?>
//Show HTML form
<input type="hidden" name="_submit_check" value="1"/>
<input type="submit" name="submit" value="Submit this form">
<?php
}
else
{
//form submitted
//do form processing and validation
}
?>

You do not need to worry about setting the submit button name attributes for Method 3 and Method 5 (sample script structure above).

Method 6 (if (!($_POST))) can have problems in a production setting, such as those observed here: http://forum.developers.facebook.net/viewtopic.php?id=30840 and here: http://modxcms.com/forums/index.php?topic=32157.0  

For Methods 1 and 2 to work properly, the developer must set the name attribute of the submit button: 

<input type="submit" name="submit" value="Submit this form">

And then use the condition: if (!$_POST['submit']) or if (!isset($_POST['submit']))

Method 4 will not work with $HTTP_SERVER_VARS deprecated: http://php.net/manual/en/reserved.variables.server.php.

In upcoming tutorials, image submission, button elements and GET methods, etc. will be covered.