ExtJS How to modify the textfield parameter autocomplete="off"

Question

Some modern (Safari, chrom, firefox) browser records informations and allows you to autocomplete some textfields when you come back.

I want to do it in ExtJS. I have a piece of answer here :

How to get Chrome to remember login on forms?

But in ExtJS, I can not access to the parameter autocomplete. It is always hard coded autocomplete="off". In the doc, I do not found how to modify it : http://docs.sencha.com/ext-js/4-1/#!/api/Ext.form.field.Text

Is someone has a simple answer to modify this parameter ?

Neil McGuigan · Accepted Answer · 2013-11-12T08:16:44.290

You want to add an afterrender listener to the textfield, get a reference to the input element, and set its autocomplete attribute to "on". You probably also want to set its name (as that is how the browser remembers the value).

Example:

http://jsfiddle.net/4TSDu/19/

{
    xtype:'textfield',
    fieldLabel:'some field',
    name:'somefield',
    listeners:{
        afterrender:function(cmp){
            cmp.inputEl.set({
                autocomplete:'on'
            });
        }
    }
}

score 0 · Answer 2 · answered Oct 13 '19 at 14:51

Note that to make LastPass work you might need to remove size attribute from textfields. For some weird reasons Sencha is setting size=1 which is weird (was that because of IE6? maybe even IE5.5?).

Anyway this makes LastPass work. I guess you might want to remove autocomplete attribute as well for other password managers. Tested with ExtJS 6.5.

    {
        xtype: 'textfield',
        name: 'username',
        fieldLabel: 'Username',
        listeners:{
            afterrender:function(cmp){
                cmp.inputEl.dom.removeAttribute('size')
            }
        },
    },

ExtJS How to modify the textfield parameter autocomplete="off"

2 Answers2