javascript - Auto complete for HTML forms -

i looking answers regarding auto complete form fields.

how can auto fill common inputs first name, last name, address..?

in chrome, if user has google profile, fields can autofilled.

it appears ie offers similar functionality:

(from ms website) "you can use autocomplete store passwords , other information type web form fields. when turn on autocomplete, internet explorer automatically fill in fields type web forms frequently, name , address."

is there way can ensure autofill happens, cross-browser, using html/js?

this question pretty old have updated answer 2017!

now there is cross-browser standard on how name <input> tags in order trigger autocomplete.

here's link official current whatwg html standard enabling autocomplete.

google wrote pretty nice guide developing web applications friendly mobile devices. have section on how name inputs on forms use auto-fill. eventhough it's written mobile, applies both desktop , mobile!

how enable autocomplete on html forms

here key points on how enable autocomplete:

• use <label> <input> fields
• add autocomplete attribute <input> tags , fill in using guide.
• name name , autocomplete attributes correctly <input> tags

• example:

  <label for="frmnamea">name</label> <input type="text" name="name" id="frmnamea" placeholder="full name" required autocomplete="name">  <label for="frmemaila">email</label> <input type="email" name="email" id="frmemaila" placeholder="name@example.com" required autocomplete="email">  <!-- note "emailc" not autocompleted --> <label for="frmemailc">confirm email</label> <input type="email" name="emailc" id="frmemailc" placeholder="name@example.com" required autocomplete="email">  <label for="frmphonenuma">phone</label> <input type="tel" name="phone" id="frmphonenuma" placeholder="+1-555-555-1212" required autocomplete="tel"> 

how name <input> tags

in order trigger autocomplete, make sure correctly name name , autocomplete attributes in <input> tags. automatically allow autocomplete on forms. make sure have <label>! information can found here.

here's how name inputs:

• name
  • use of these name: name fname mname lname
  • use of these autocomplete:
    • name (for full name)
    • given-name (for first name)
    • additional-name (for middle name)
    • family-name (for last name)
  • example: <input type="text" name="fname" autocomplete="given-name">
• email
  • use of these name: email
  • use of these autocomplete: email
  • example: <input type="text" name="email" autocomplete="email">
• address
  • use of these name: address city region province state zip zip2 postal country
  • use of these autocomplete:
    • for 1 address input:
      • street-address
    • for 2 address inputs:
      • address-line1
      • address-line2
    • address-level1 (state or province)
    • address-level2 (city)
    • postal-code (zip code)
    • country
• phone
  • use of these name: phone mobile country-code area-code exchange suffix ext
  • use of these autocomplete: tel
• credit card
  • use of these name: ccname cardnumber cvc ccmonth ccyear exp-date card-type
  • use of these autocomplete:
    • cc-name
    • cc-number
    • cc-csc
    • cc-exp-month
    • cc-exp-year
    • cc-exp
    • cc-type
• usernames
  • use of these name: username
  • use of these autocomplete: username
• passwords
  • use of these name: password
  • use of these autocomplete:
    • current-password (for sign-in forms)
    • new-password (for sign-up , password-change forms)

resources

• current whatwg html standard autocomplete.
• "create amazing forms" google. seems updated daily. excellent read.
• "help users checkout faster autofill" google in 2015.