HTML Form: The HTML Form’s Action Attribute

The action attribute within a HTML form element specifies where to send the form data when a form is submitted.

• By Mensah Alkebu-Lan
• 03 February 2023

Table of Contents

• Overview
• References

Overview

An HTML form is used to collect user input. The HTML form element is used to create an HTML form. It is a container for different types of input elements, such as text fields, checkboxes, radio buttons, and submit buttons to name a few. There is also the file input tag that lets the user choose one or more files from their device storage.

<input type=”file” /> 

The action attribute within a HTML form element specifies where to send the form data when a form is submitted. This attribute follows the syntax:

<form action=”URL”>  

The value of the action can be an internal URL, external URL, or JavaScript function. As an example, consider the following simple HTML form:

<form action=”action_page.php” mehod=”get”> 
  <label for="fname">First name:</label> 
  <input type="text" id="fname" name="fname"><br> 
  <input type="submit" value="Submit"> 
</form> 

The method attribute works in tandem with the action attribute. The value of this attribute is the HTTP method to submit the form with. Its possible values (case-insensitive) are POST and the default GET.

The above example is one using the GET method. When the POST method is used, the enctype method becomes relevant. This is the MIME type of the form submission. Its default value is application/x-www-form-urlencoded. Other possible values are multipart/form-data and text/plain.

Elements often used with forms are fieldsets and legends. A full description of these two elements are sligthly outside the scope of this discussion, but we do offer the following example to get a glimpse of how the elemetns are used together.

<form method="post"> 
  <fieldset> 
    <legend>Do you agree to the terms?</legend> 
    <label><input type="radio" name="radio" value="yes" /> Yes</label> 
    <label><input type="radio" name="radio" value="no" /> No</label> 
  </fieldset> 
</form> 

The last input element represents a submit button. When submitting the form by clicking the submit button, the form data will be sent to a file on the server called “action_page.php.”

References

1. “HTML form action Attribute.” W3Schools. Accessed 1 February 2023
2. “HTML form action Attribute.” Dofactory. Accessed 1 February 2023.
3. “<form>: The Form element - HTML: HyperText Markup Language - MDN.” MDN Web Docs, 30 January 2023. Accessed 1 February 2023
4. “HTML Forms.” W3Schools. Accessed 1 February 2023.
5. “Forms – React.” React. Accessed 1 February 2023.
6. “<form>: The Form element - HTML: HyperText Markup Language - MDN.” MDN Web Docs, 30 January 2023. Accessed 1 February 2023.