Login

PHP Cross Browser Compatibility: How to Check if a Web Form is Submitted

This is a tutorial targeted to beginners who need to know the best way of checking if a web form is submitted using PHP. The majority of PHP web applications are form handling tasks, and it is vital that you know the different ways of checking form submission.

With this knowledge, you can choose what is appropriate for your project, and select the best method for cross browser compatibility. Remember that not all situations/methods will work in all browsers, and it is important that you select a method that will be compatible in most major browsers and in different operating systems.

At the end of this tutorial, recommended methods will be proposed based on the results of cross browser testing.

The Different Methods for Checking Form Submission

Doing research with PHP-related websites, textbooks and forums on the Internet turns up around six different techniques you can use to check if a web form is submitted using PHP.

Some of these methods rely on the submit button HTML name attribute. For example, it is common for developers to just use:

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

The above does not use the name attribute. Sometimes developers will use the name attribute for the submit button:

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

However, most developers, particularly beginners, are not aware that the presence and absence of this HTML button name attribute can make a huge difference in your PHP web form application if you decide to use a method that depends on these.

NOTE: It is highly important to adhere to correct HTML coding and it is recommended that you set the name attribute in your HTML submit button.

Again, with each of these six methods, the developer can either use the submit button name attribute or not. Let’s assign “B” to those methods that do not use the submit name attribute, and “A” to those that use the name attribute.

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: