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
The action attribute specifies where the browser should send the data collected from the user when the form is submitted. We want the data to be submitted to our Node.js script, which means we want the form to post to the /form URL on port 8080 of my development server, titan.
<form method="post" action="http://titan:8080/form">If you don’t apply the action attribute to the form element, the browser will send the form data to the same URL that the HTML document was loaded from. This isn’t as useless as it might initially appear, and several popular web application development frameworks depend on this feature. If you specify a relative URL, this value is appended to the URL of the current page (or) if you used the base element —to the value of the href attribute of that element. Below we have shown how you can use the base element to set the destination for the form data.
Using the base element to set a destination for form data
<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" />
<base href="http://titan:8080"/>
</head>
<body>
<form method="post" action="/form">
<input name="fave"/>
<button>Submit Vote</button>
</form>
</body>
</html>Note: The base element affects all relative URLs in an HTML document, not just the form element.