what happens after a form is submitted?

Question

This might be a broad answer to give but i\'l try to shorten it up. What i am trying to do is use a form to get some information from the user and \"validate the form\" using Ja

Answer 1

Without looking at your code too closely, here is the requested "big picture" overview of what happens when a form is submitted, and how to validate a form.

First, the form and what happens when it is submitted.

When you click the submit button, your form data will be sent to the file specified on the form tag - in your case, "/action_page.php". What arrives there are a number of variables (aka "key-value pairs" - but they are variables with a name and a value). Note that the "variable name" is what is specified in the name= attribute of the (for e.g.) input field, and the "variable contents" is whatever is typed into the (for e.g.) input field.

Your back-end PHP file will need to create proper PHP $variables for each of these items, using either the $_POST or $_GET command, depending what method you used in the "method=" attribute of the form tag. As an example, your form has a textarea element called name=comment. On the PHP side, you can write:

$cmt = $_GET['comment'];

and presto! you have the user's comment in a PHP variable $cmt.

You can do the validation at this stage, or you can validate the code in javascript before the file is even submitted (note that javascript can intercept the form submit process and stop it, or continue it.

Then, your PHP file can either send the user back to the same page (in which case, you need a section at the top to handle that), or on to another page entirely.

IMPORTANT NOTES:

1. Important: From your specified action= location of the PHP file, you might have some trouble because you started it with a slash. That sends the OS back to the root of the file system to find your file, and is probably not what you want. For now, put the "action_page.php" file in the same location as your index.php file and drop the leading slash.

2. At the beginning, do not use the same PHP file to receive the form that you are using to display the form to the user. Same goes for AJAX (getting to that). Do things at first so it is easy for you to understand the process, then make it cooler.

3. You can validate the user data either in JS before you submit, or in PHP after submitting. However, javascript can be read, debugged, and even changed in the DevTools (F12) console - so other than super basic stuff like "Was the field left blank", do not do your important validation in javascript.

4. NEVER TRUST USER DATA. Some users are hackers and they can OWN you if you do not sanitize the data they enter. Research sanitizing user data and this also will get you started on the understanding part.

AJAX

When you submit a form, the screen will refresh. So what about those websites where you fill-in a form, submit, and nothing refreshes but the changes are updated on the existing page. That is done through AJAX.

AJAX is really very simple - almost simpler than a form. The cardinal rule of getting started with AJAX is the same as my note above: have a different back-end PHP file than the one the user is presently on.

Frankly, these days, we don't really use forms very much anymore. Almost everything we used to do with forms we now do with AJAX - and It Is Easy!

So how does AJAX work? Essentially, javascript sends the form data (see below examples!) to the specified PHP file, which processes the data and echo's back a response. You receive that response, break it up into variables, and change the page accordingly. See references below for more.

NOTE: If you take ten minutes to try the examples in the referenced posts below, you will save yourself HOURS of head scratching. Just reproduce the examples on your own server and play with them a bit.

REFERENCES:

How a form works

HTML Forms vs Ajax

Simple overview of AJAX

Simple login system with ajax