Submitting Forms, Server Scripting Mechanisms and Security Issues
Start course

Forms are one of the core parts of HTML functionality. They let users submit key information and are used in every industry and on most websites. They’re a big topic, so in this module we’ll go into a lot of detail. You’ll learn about forms in general, text and push buttons and multi-line inputs. Then we’ll move onto checkbox and radio buttons, as well as list boxes and drop down lists. One of the more detailed lessons in this module comes up next, with a deep dive into some of the input types you can use in your forms. Finally, we’ll end the module off with form validation and a little bit about form validation, server scripting and a few security issues you need to be aware of.


Forms are a fantastic tool for capturing used data but if you can't capture this information, it's pretty much useless. So, how do servers, capture the information in a form? When a user hits the submit button, the browser takes all the information in the forms, inputs and text fields,combines them with the names and their corresponding values into a combined stream. The way this is then sent to the server, depends on if the method attribute is sent to post or get. The actual address the data is sent to, is set in the action attribute.

So, let's have a quick look at exactly what happens when a client sends a post or get request to a server, and how the servers should respond. A form that specifies a get method, will create a query string that is attached to the end of the U-R-L supplied in the action attributes. This query string starts with a question mark and then has each field name in its equivalent value separated by a number set. Servers set up to receive get requests will take this query string and are able to extract the data from it. Post methods are a little different. Unlike a get request, with data appears in the U-R-L, the form data is put into the body of the request that is sent as a Javascript object that has key value pairs for each field.

Again, a server set up to receive post requests, will be able to obtain and use that data. Server will supply a response to the data they receive. This can be new data to display, or confirmation, or air messages, depending on what happened when the sent data was received. so, which method should you use on a form and when? In general, if you're submitting new data to a server, then a post request should be used as this is the correct HTTP verb for creating a new data. If you are just supplying some data to help the server return the information we want, like the color, the size options of a pair of jeans, this will be sent as a get request because it's a query string. Just to extend your knowledge of HTTP verbs. If you are providing a form to update some existing data, then a put request method should be used. The put method is the correct HTTP verb to replace existing data.

Last up for this video, I want to mention a few security related issues when it comes to forms. The thing to remember when you make a form is that users can type pretty much anything they want into a form. That's where validation of the client comes in. We want to restrict what a user can enter as a start. We also need to think about how the data is sent. Get, post and put and any other HTTP method will be sent in plain text if the HTTP:// protocol is used. That means that the package sent can be intercepted and read by whoever has intercepted it. So, how do we make sending data secure? You probably guessed it. We've got to use HTTPs:// and that's it for this video on how forms are submitted.


About the Author
Learning Paths

Ed is an Outstanding Trainer in Software Development, with a passion for technology and its uses and holding more than 10 years’ experience.

Previous roles have included being a Delivery Manager, Trainer, ICT teacher, and Head of Department. Ed continues to develop existing and new courses, primarily in web design using: PHP, JavaScript, HTML, CSS, SQL, and OOP (Java), Programming Foundations (Python), and DevOps (Git, CI/CD, etc). Ed describes himself as practically minded, a quick learner, and a problem solver who pays great attention to detail. 

Ed’s specialist area is training in Emerging Technologies, within Web Development. Ed mainly delivers courses in JavaScript covering vanilla JS, ES2015+, TypeScript, Angular, and React (the latter is authored by Ed) and has delivered on behalf of Google for PWAs. Ed has also developed a new suite of PHP courses and has extensive experience with HTML/CSS and MySQL. 

Ed is responsible for delivering QA’s Programming Foundations course using the Eclipse IDE. His skillset extends into the DevOps sphere, where he is able to deliver courses based around Agile/Scrum practices, version control, and CI/CD.

Covered Topics