Forms and inputs come in vary handy, they can be used to create a search box, login form, registration form, comment box, status updates and a 101 different things.
A html form once submitted can, display the results in front of you, email it to a specified email address, insert the data into a file, insert the data to a sql database, send the data to another website and so on.
In this example we are going to look at how to create a simple contact us form. The form will ask for their name, email address, reason for contacting us, and their message. It wont include any stylers but if you copy and paste the final code it will work.
Create A HTML Form
The form starts off with a method and an action. I use POST as the method as its more secure, if you use GET then it will make the data viewable in the url bar. The action value asks where you want to POST the data to, I tend to process the data within the same page as opposed to send it to another page.
Like most HTML commands the form has an open and close command.
The first and second inputs are both text inputs, this means the user is allowed to write text within these inputs. Each input has a name, the name should be unique to other inputs and is how you can call that bit of information.
The placeholder attribute is the default text that appears in the input box before the user clicks into it, it can be used as a guideline as to what is expected to be entered into that input.
The required attribute means this field is required and the form cant be submitted until it is completed.
The final input is a text area, this is where the user can type their message to you. Notice how the text area has a opening command as well as a closing command. There is also no placeholder, the placeholder is actually in-between the opening and closing tags. The field still has a a unique name attribute and is also a required field.
The final input is a submit input, this means its a button and once clicked it will submit your data. It also has a name attribute and has an additional attribute called value, value is a lot like placeholder in the sense that it will display this text on the button\input.
<form method="POST" action="page.php">
<input type="text" name="Fullname" placeholder="Full Name" required>
<input type="subject" name="subject" placeholder="Subject" required>
<textarea name="message" required>Message</textarea>
<input type="submit" name="submit" value="Submit">
</form>Thats it, that’s a basic form which will work if you use it. However, we haven’t told it to do anything with the data yet, this is where you could have it email it to you, or add it to a database.
HI hope this was of use to you, please feel free to leave a comment
