HTML input Tag

HTML <select> - <option> Tag and JavaScript

Attributes - option w3.org

Attribute Value Example / Description
accept audio/*
video/*
image/*
MIME_type
<input type="file" name="pic" accept="image/*">
Specifies the types of files that the server accepts (only for type="file")
align left
right
top
middle
bottom
<input type="image" src="image.gif" alt="IMAGE DESCRIPTION" align="right" width="30" height="30">
Specifies the alignment of an image input (only for type="image")
alt text <input type="image" src="image.gif" alt="IMAGE DESCRIPTION" width="30" height="30">
Alternate text for images (only for type="image")
autocomplete on/off <input type="email" name="email" autocomplete="off">
Specifies whether an <input> element should have autocomplete enabled
autofocus autofocus <input type="text" name="email" autofocus>
<input> element should automatically get focus when the page loads
checked checked <input type="checkbox" name="newsletter" value="subscribe" checked>
<input> element should be pre-selected when the page loads (for type="checkbox" or type="radio")
disabled disabled <input type="text" name="lname" disabled>
<input> element should be disabled
form form_id <form action="register.php" id="formNews">
.....
</form>

An input field located outside the HTML form but is still a part of the form.
Email address: <input type="text" name="email" form="formNews">

Specifies one or more forms the <input> element belongs to
formaction URL

<form action="register.php" id="formNews">
....
<input type="submit" formaction="register_admin.php" value="Submit as admin">
</form>

Specifies the URL of the file that will process the input control when the form is submitted (for type="submit" and type="image")
formenctype application/x-www-form-urlencoded
multipart/form-data
text/plain
<input type="submit" formenctype="multipart/form-data" value="Submit as Multipart/form-data">

Specifies how the form-data should be encoded when submitting it to the server (for type="submit" and type="image")
formmethod get / post <input type="submit" formmethod="post" formaction="register.php" value="Submit using POST">

Defines the HTTP method for sending data to the action URL (for type="submit" and type="image")
formnovalidate formnovalidate formnovalidate="formnovalidate"

Defines that form elements should not be validated when submitted
formtarget _blank
_self
_parent
_top
framename
<input type="submit" formtarget="_blank" value="Submit to a new window">

Specifies where to display the response that is received after submitting the form (for type="submit" and type="image")
height pixels <input type="image" src="img_submit.gif" alt="Submit" width="48" height="48">

Specifies the height of an <input> element (only for type="image")
list datalist_id

<input list="browsers">

<datalist id="browsers">
  <option value="Internet Explorer">
  <option value="Firefox">
  <option value="Opera">
  <option value="Safari">
</datalist>

Refers to a <datalist> element that contains pre-defined options for an <input> element

max number
date

  Enter a date before 1980-01-01:
  <input type="date" name="bday" max="1979-12-31">

  Enter a date after 2000-01-01:
  <input type="date" name="bday" min="2000-01-02">

  Quantity (between 1 and 5):
  <input type="number" name="quantity" min="1" max="5">
 

Specifies the maximum value for an <input> element
maxlength number <input type="text" name="usrname" maxlength="16">

Specifies the maximum number of characters allowed in an <input> element
min number
date

  Enter a date before 1980-01-01:
  <input type="date" name="bday" max="1979-12-31">

  Enter a date after 2000-01-01:
  <input type="date" name="bday" min="2000-01-02">

  Quantity (between 1 and 5):
  <input type="number" name="quantity" min="1" max="5">
 

Specifies a minimum value for an <input> element
multiple multiple A file upload field that accepts multiple values
Select images: <input type="file" name="img" multiple>

Specifies that a user can enter more than one value in an <input> element
name text <input type="text" name="fname">
the name of an <input> element
pattern regexp Country code: <input type="text" name="country_code" pattern="[A-Za-z]3" title="Three letter country code">

Specifies a regular expression that an <input> element's value is checked against
placeholder text <input type="text" name="fname" placeholder="First name">

Specifies a short hint that describes the expected value of an <input> element
readonly readonly <input type="text" name="country" value="The Netherlands" readonly>
Specifies that an input field is read-only
required required Email address: <input type="text" name="email" required>

Specifies that an input field must be filled out before submitting the form
size number ZIPCODE: <input type="text" name="zip" maxlength="6" size="6">
Specifies the width, in characters, of an <input> element
src URL <input type="image" src="/path/to/submit.gif" alt="Submit">
Specifies the URL of the image to use as a submit button (only for type="image")
step number <input type="number" name="points" step="3">
Specifies the legal number intervals for an input field
type button
checkbox
color
date
datetime
datetime-local
email
file
hidden
image
month
number
password
radio
range
reset
search
submit
tel
text
time
url
week
<input type="text" name="usrname"><br>
<input type="submit" value="Submit">

Specifies the type <input> element to display
value text First name: <input type="text" name="fname" value="Enter Your Name">
<input type="submit" value="Submit form">

Specifies the value of an <input> element
width pixels <input type="image" src="img_submit.gif" alt="Submit" width="48" height="48">

Specifies the width of an <input> element (only for type="image")
<form action="register.php" id="formNews" name="formNews">
  First name: <input type="text" name="fname" required><br>
  Last name: <input type="text" name="lname"><br>
  Email address: <input type="text" name="email" autocomplete="off" required><br>
  <input type="submit" value="Submit">
</form>

 

HTML Forms and Input


HTML Forms

<form>
....
input elements
....
</form>


Text Fields

First name: <input type="text" name="firstname">


Textarea Fields

<textarea id="message" name="message" rows="10" cols="50">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed 
diam nonummy nibh euismod tincidunt ut laoreet dolore magna 
aliquam erat volutpat.
</textarea>


Password Field

Password: <input type="password" name="pwd">


Radio Buttons

<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female


Checkboxes

<input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car


Submit Button

<input type="submit" value="Submit">