Modificaciones sobre el formulario
Nota: Hasta hace un tiempo los navegadores se comportaban de esta manera cuando se agregaba el atributo autocomplete=”off” al formulario, pero ya no más a partir de IE11, Chrome 34 y Firefox 30.
Modificación 1: agregamos al formulario el atributo autocomplete=”off”
. Aunque no es esencial hacerlo, en versiones de los navegadores previas a las indicadas se contempla.
En este ejemplo deshabilitas el auto completado automático en todos los campos.
Si deseas habilitar el auto completado en un campo específico lo puedes hacer añadiendo el atributo autocomplete="on"
al cualquier campo.
<form action="#" method="post" autocomplete="off">
Email: <input type="text" name="email">
Nombre: <input type="text" name="nombre">
<input type="submit" value="enviar">
</form>
También se puede aplicar a un campo específico:
<input type="text" name="email" autocomplete="off">
Modificación 2: cambiamos el tipo de input submit por button. Esto es lo que evita que la mayoría de los navegadores proponga recordar.
Modificaciones sobre el código javascript
Ejemplo formulario de login.
Modificación 3: establecemos el login_button como elemento a observar y el evento click (en lugar del submit del elemento login_form):
Event.observe( 'login_button', 'click', formProcess);
Modificación 4: agregamos al final de la función formProcess
la acción de submit
del formulario
$('login_form').submit();
Agregamos el atributo onkeypress
en cada uno invocando a una nueva función checkEnter
, la cual al detectar que se presionó Enter
invoca la función de procesamiento del formulario:
Email: <input type="text" name="e" id="email" onkeypress="checkEnter(event)" /><br />
Password: <input type="password" name="p" id="password" onkeypress="checkEnter(event)" /><br />
Formulario completo del ejemplo javascript
javascript
<script type="text/javascript">
Event.observe(window, 'load', function(){
Event.observe( 'login_button', 'click', formProcess);
});
function formProcess(){
//agregar validaciones
$('secret').value = hex_sha512($('password').value);
$('password').value = '';
$('login_form').submit();
}
function checkEnter(e){
var codigoCaracter = (e && e.which) ? e.which : event.keyCode;
if(codigoCaracter == 13) {
formProcess();
}
else {
return true;
}
}
</script>
Formulario
<form action="index.cgi" autocomplete="off" method="post" id="login_form" name="login_form">
Email: <input type="text" name="e" id="email" onkeypress="checkEnter(event)" /><br />
Password: <input type="password" name="p" id="password" onkeypress="checkEnter(event)" /><br />
<input type="hidden" name="ps" id="secret">
<input type="button" value="Login" id="login_button" />
</form>
Dos ejemplos de como deshabilitar autocompletado en formularios.