Autocomplete Form Script

This script adds an "autocomplete" tag to various fields in your form to help visitors complete them quicker.

const inputs = document.getElementsByTagName("input");

for(let item of inputs){
switch(item.type){
case "text":
if((item.name.indexOf("ship") != -1) && (item.name.indexOf("address") != -1)){
item.autocomplete = "shipping street-address";
}else if((item.name.indexOf("ship") != -1) && (item.name.indexOf("city") != -1)){
item.autocomplete = "shipping address-level2";
}else if((item.name.indexOf("ship") != -1) && (item.name.indexOf("state") != -1)){
item.autocomplete = "shipping address-level1";
}else if((item.name.indexOf("ship") != -1) && (item.name.indexOf("country") != -1)){
item.autocomplete = "shipping country";
}else if((item.name.indexOf("ship") != -1) && (item.name.indexOf("zip") != -1)){
item.autocomplete = "shipping postal-code";
}else if((item.name.indexOf("bill") != -1) && (item.name.indexOf("address") != -1)){
item.autocomplete = "billing street-address";
}else if((item.name.indexOf("bill") != -1) && (item.name.indexOf("city") != -1)){
item.autocomplete = "billing address-level2";
}else if((item.name.indexOf("bill") != -1) && (item.name.indexOf("state") != -1)){
item.autocomplete = "billing address-level1";
}else if((item.name.indexOf("bill") != -1) && (item.name.indexOf("country") != -1)){
item.autocomplete = "billing country";
}else if((item.name.indexOf("bill") != -1) && (item.name.indexOf("zip") != -1)){
item.autocomplete = "billing postal-code";
}else if(item.name.indexOf("ccname") != -1){
item.autocomplete = "cc-name";
}else if(item.name.indexOf("cardnumber") != -1){
item.autocomplete = "cc-number";
}else if(item.name.indexOf("cvc") != -1){
item.autocomplete = "cc-csc";
}else if(item.name.indexOf("cc-exp") != -1){
item.autocomplete = "cc-exp";
}else{
if(item.previousElementSibling != null){
item.autocomplete = item.previousElementSibling.innerText.replace(/ /g,'').toLowerCase();
}else{
item.autocomplete = item.parentElement.previousElementSibling.innerText.replace(/ /g,'').toLowerCase();
}
}
break;
case "email":
item.autocomplete = item.name;
break;
case "password":
item.autocomplete = item.name;
break;
case "number":
item.autocomplete = item.name;
break;
case "date":
item.autocomplete = item.name;
break;
case "tel":
item.autocomplete = item.name;
break;
default:
break;
}
}

Overview

The autocomplete feature is vital for multiple reasons. People dislike filling out web forms, especially on mobile devices. Forms can be frustrating to complete and often contain multi-page steps and validation issues. Autocomplete feature prevents spelling mistakes on form and prevents validation issues. Autocomplete variant is a way for you, site owner, to control how the browser populates a given form field.