There are a few elements you need to be aware of when writing a simple form in HTML;
The <form>
Tag
This is where you describe what you want the form to do and where to send it.
I won’t go through all the options here, but when you want the user to submit details you usually use the post
method. We do this with the code method='post'
.
You then need to say where you’re sending the form, which is usually another webpage with some sort of scripting capability, such as PHP, ASP.net, or similar. We do this with the code action='process.php'
where process.php is the page that the form is being sent to. Use of a server side language is more likely to be a acceptable solution to process the form.
We can put these two parts, called arguments, inside the <form>
tag like this;
<form method='post' action='process.php'>
<input>
Elements
For the purposes of this form, we’ll concentrate on the text input elements.
In the simplest form, input elements just require a name
and a type
. The name is an identifier so we know what information was entered in what field when processing the form. The type could be text
, password
, email
, date
, and a few others. We’re going to use the first two here, so the code will look like.
Username: <input type="text" name="username"><br>
Password: <input type="password" name="password"><br>
The <br>
signifies we want the next bit of content on a new line.
Submit Button
Don’t forget your button to submit. The code for that is;
<input type="submit" value="Submit">
Couldn’t be simpler (you can change the text on the button by changing the value
).
The Finished Product
Let’s put that all together;
<form method='post' action='process.php'>
Username: <input type="text" name="username"><br>
Password: <input type="password" name="password"><br>
<input type="submit" value="Submit">
</form>
Don’t forget to end your form with the closing </form>
tag.
Hope this helps.
4
solved How do I make a (mock) bank system? [closed]