An HTML form is used to collect user input.
The user input is most often sent to a server for processing.
ex: sample how to write form in html
<form action="">
</form>
Some examples:
<form action="">
// <!-- The action attribute specifies where to send the form-data when a form is submitted. -->
<label for="">Enter You Name:</label>
// <!-- The for attribute of <label> must be equal to the id attribute of the related element to bind them together. A label can also be bound to an element by placing the element inside the <label> element. -->
<input type="text">
<br>
<label for="">Enter You Age:</label>
<input type="number" name="" id="">
</form>
Difference between GET & POST :
GET Method
Appends form-data into the URL in name/value pairs
The length of a URL is limited (about 3000 characters)
Never use GET to send sensitive data! (will be visible in the URL)
Useful for form submissions where a user wants to bookmark the result
GET is better for non-secure data, like query strings in Google
<form action="" method="get">
</form>
POST Method
Appends form-data inside the body of the HTTP request (data is not shown in URL)
Has no size limitations
Form submissions with POST cannot be bookmarked
<form action="" method="post">
</form>
Some input types of form tag :
<form action="">
<h2>Types of inputs in form tag</h2>
<label for="">Text : </label>
<input type="text" placeholder="Enter Text">
<br>
<br>
<label for="">Email : </label>
<input type="email" placeholder="Enter email">
<br>
<br>
<label for="">Number : </label>
<input type="number" placeholder="Enter Number">
<br>
<br>
<label for="">Password : </label>
<input type="password" placeholder="Enter Password">
<br>
<br>
<label for="">Date : </label>
<input type="date" >
<br>
<br>
<label for="">Radio Button : </label>
<input type="radio" value="Male" name="gender">Male
<input type="radio" value="female" name="gender">Female
<input type="radio" value="other" name="gender">other
<br>
<br>
<label for="">checkbox : </label>
<input type="checkbox" value="cricket">Cricket
<input type="checkbox" value="reading">Reading
<input type="checkbox" value="swimming">swimming
<br>
<br>
<label for="">Range : </label>
<input type="range">
<br>
<br>
<label for="">File : </label>
<input type="file" >
<br>
<br>
<label for="">Color : </label>
<input type="color" >
<br>
<br>
<label for="">Submit : </label>
<input type="submit" >
<br>
<br>
<label for="">Reset : </label>
<input type="reset" >
<br>
<br>
<label for="">Range : </label>
<input type="">
</form>
Output :
->Tawajo chahunga
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Form</title>
</head>
<body>
<marquee behavior="" direction=""> <h2>Form Example</h2></marquee>
<center>
<form action="" method="get">
<label for="name">Enter Your Name : </label>
<input type="text" name="" id="name" placeholder="Enter Your Name">
<br>
<br>
<label for="email">Enter Your Email : </label>
<input type="email" name="" id="email" placeholder="Enter Your Email">
<br>
<br>
<label for="moile">Enter Your Mobile Number : </label>
<input type="number" name="" id="Mobile" placeholder="Enter Your mobile number">
<br>
<br>
<label for="moile">Enter Your Mobile Number : </label>
<input type="number" name="" id="Mobile" placeholder="Enter Your mobile number">
<br>
<br>
<label for="dob">Enter DOB: </label>
<input type="date" name="" id="dob" >
<br>
<br>
<label for="gender">Select Gender : </label>
<input type="radio" name="gender" id="gender" value="male">Male
<input type="radio" name="gender" id="gender" value="female">Female
<input type="radio" name="gender" id="gender" value="other">other
<br>
<br>
<input type="submit" value="Submit" name="submit">
<input type="reset" value="Reset" name="reset">
</form>
</center>
</body>
</html>
(Hinglish)
Form ek bohot hi kaam ki cheez h html mai,
ye users se input leneka kaam karta h.
DAY_9 26_Jan(Thu)_2023