HTML Forms

HTML Forms

HTML forms are used to collect input from users and send it to a server for processing. Forms are essential for login pages, registration, search, surveys, and contact pages.

The main element is <form>, which contains input fields, buttons, and other controls.


Basic Syntax

  • action → URL of the server script that will process the form

  • method → How the data is sent:

    • GET → Appends data to URL

    • POST → Sends data securely


Common Form Elements

Element Purpose
<input type="text"> Single-line text input
<input type="password"> Password input
<input type="email"> Email input with validation
<input type="number"> Numeric input
<textarea> Multi-line text input
<select> + <option> Dropdown list
<input type="radio"> Radio button (select one)
<input type="checkbox"> Checkbox (select multiple)
<button> / <input type="submit"> Submit button
<input type="reset"> Reset button

Example HTML Form


 


Output Preview

  • Name field → Single-line text input

  • Email field → Validated email input

  • Message field → Multi-line textarea

  • Submit button → Sends data to submit_form.php

  • Reset button → Clears the form


Key Points

  • Always use labels for accessibility.

  • Use required or pattern attributes for input validation.

  • Forms can be styled with CSS for better appearance.

  • Use server-side scripts (PHP, Node.js, etc.) to handle form data securely.

CodeCapsule

Sanjit Sinha — Web Developer | PHP • Laravel • CodeIgniter • MySQL • Bootstrap Founder, CodeCapsule — Student projects & practical coding guides. Email: info@codecapsule.in • Website: CodeCapsule.in

You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *