More about WEB PAGE
Anatomy of the <head>
Grouping content
- Understanding the need to group content
- Using the div Element
- Grouping content into lists
- Dealing with figures
Creating advanced tables
- Adding table headers cells
- Denoting the headings and the table body
- Creating irregular tables
- Applying borders to the table element
Form Handling
- The action attribute
- The method attribute
- Configuring the Data Encoding
- Controlling form completion
- Setting the name of the form
- Adding labels to a form
- Automatically focusing on an input element
- Disabling individual input elements
- Grouping form elements together
- Using the button element
Customizing the input element
- Using the input element for text input
- Setting values and using placeholders
- Using a data list
- Creating read-only and disabled text boxes
- Restrict data entry
Using input validation
There are times when you want to allow the user to submit the form without validating the contents. A good example is when the user needs to save progress through an incomplete process. You want the user to be able to save whatever they have entered so that they can resume the process later. This would be a frustrating process if all errors had to be corrected before progress could be saved. You can submit the form without validation either by applying the novalidate attribute to the form element, or the formnovalidate attribute to the types of the button and input elements that can submit forms. The below example shows how you can disable form validation.
<html>
<head>
<title>Example</title>
<meta name="author" content="Adam Freeman"/>
<meta name="description" content="A simple example"/>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
</head>
<body>
<form method="post" action="http://titan:8080/form">
<input type="hidden" name="recordID" value="1234"/>
<p>
<label for="name">
Name:
<input type="text" id="name" name="name" pattern="^.* .*$"/>
</label>
</p>
<p>
<label for="password">
Password: <input type="password" placeholder="Min 6 characters" id="password" name="password"/>
</label>
</p>
<p>
<label for="email">
Email: <input type="email" placeholder="user@mydomain.com" required pattern=".*@mydomain.com$" id="email" name="email"/>
</label>
</p>
<input type="submit" value="Submit"/>
<input type="submit" value="Save" formnovalidate/>
</form>
</body>
</html>In this example, we have added an input element to the HTML document that will submit the form without validation, allowing the user to save progress (assuming of course, that there is a corresponding feature implemented at the server that will accept values from the browser without applying further validation).