CODEWITHSUNDEEP
htmlcss
ps0604
ps0604

Reputation: 1071

How to define `autocomplete="off"` as a CSS style?

To turn off autocompletion in HTML I use:

    <input type="text" name="foo" autocomplete="off" />

But this forces me to specify autocomplete="off" in every input field of my application. Is it possible to define autocomplete="off" in a CSS style?

Upvotes: 7

Views: 13472

Answers (6)

Sara Murtuzayeva
Sara Murtuzayeva

Reputation: 60

U can use autocomplete="off" attribute on form tag. Like 

<form id='test' autocomplete="off">
  <input ...
  <input .. 
   ...
 </form>

Upvotes: 2

Ahmed Salama
Ahmed Salama

Reputation: 2825

No you can't do this using css, but there are 2 other ways to do it:

1- you can apply it for the form 

<form autocomplete="off" >
  <input type="text" name="name">
  <input type="text" name="mail">
</form>

2- you can handle it using js 

var eles = document.getElementsByTagName('input');
for(i=0; i<eles.length; i++){
    eles[i].setAttribute("autocomplete", "off");

}

https://jsfiddle.net/ng1mb77m/1/

Upvotes: 1

Mohammad Usman
Mohammad Usman

Reputation: 39322

You can set it on form element if you wants to set autocomplete: off for all input elements of form. And if wants to make it on for some selected input you can apply autocomplete: on on that input.

.form {
  padding: 30px 0;
  width: 300px;
  margin: 0 auto;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<form action="#" class="form" autocomplete="on">
  <div class="form-group">
    First name:<input type="text" class="form-control" name="fname">
  </div>
  <div class="form-group">
    Last name:<input type="text" class="form-control" name="lname" autocomplete="off">
  </div>
  <div class="form-group">
    E-mail: <input type="email" class="form-control" name="email">
  </div>
  <input type="submit">
</form>

Upvotes: 1

Rahul Tripathi
Rahul Tripathi

Reputation: 172378

Using CSS you cannot achieve it. You can use client side script for example using Jquery

$('input').attr('autocomplete','off');

If you are not using Jquery or scripting language then you have to stick to HTML only.

As TeT Psy said you can apply it in form tag like

<form id="Form" runat="server" autocomplete="off">

Upvotes: 5

Mahendra Kulkarni
Mahendra Kulkarni

Reputation: 1507

you can disable all the autocompletes using form 

<form id="Form1" runat="server" autocomplete="off">

Upvotes: 2

TeT Psy
TeT Psy

Reputation: 341

You can just apply it to the form tag.

Upvotes: 12

Related Questions