HTML Form Attributes
HTML <form> elements can have various attributes that define their behavior and interaction with users. Here are some commonly used HTML form attributes:
- action: Specifies the URL of the script where the form data should be submitted.
- method: Defines the HTTP method used to submit the form data, typically GET or POST.
When using GET, form data is appended to the URL as query parameters, making it visible to users in the address bar. This method is suitable for scenarios where users might want to bookmark or share the resulting URL. However, GET has limitations on the amount of data it can transmit due to URL length restrictions, and it’s less secure for sensitive information since data is exposed in the URL.
For example
www.websiteurl.com?fname=first&lname=last
In contrast, POST sends form data in the body of the HTTP request, keeping it out of view in the URL. This method is more secure for transmitting sensitive information like passwords, as it doesn’t expose data directly in the browser’s address bar. POST submissions aren’t cached by default and support larger data sizes, making it ideal for handling forms with extensive or confidential information. Unlike GET, POST submissions aren’t easily bookmarked because the form data isn’t reflected in the URL itself.
- target: Specifies where to display the response received after submitting the form (_self, _blank, _parent, _top, or a frame name).
- enctype: Specifies how form data should be encoded before sending it to the server (application/x-www-form-urlencoded, multipart/form-data, or text/plain).
- autocomplete: Controls whether the browser should automatically complete form fields based on earlier user input (on or off).
- novalidate: Prevents browser validation of form input fields (useful when performing custom validation with JavaScript).
- name: Assigns a name to the form, which can be used to reference the form element in scripting.
- id: Specifies a unique identifier for the form element.
- class: Assigns one or more CSS class names to the form element, enabling styling via CSS.
- onsubmit: Specifies a JavaScript function to execute when the form is submitted.
- onreset: Specifies a JavaScript function to execute when the form is reset.
- accept-charset: Specifies the character encoding used to submit the form data to the server (UTF-8, ISO-8859-1, etc.).