Override a system event: textfield clear

Question

I've got many TextFields in my app, all with the same problem: After pressing the clear-icon in the right the focus of this textbox is lost.

This solution works but is not efficient, because then I'd have to do it for every textfield:

                {
                    xtype: 'textfield',
                    label: 'Name',
                    onClearIconTap: function() {
                                        this.setValue('');
                                        console.log('onClearTap');
                                    }
                }

I've come across this page, overriding the event, but it doesn't work. This would be a preferred solution:

Any help?

score 3 · Answer 1 · answered Oct 31 '12 at 12:08

Here's how to override the function, inside the app.js launch-function for Sencha Touch 2:

Ext.field.Text.override({
        onClearIconTap: function() {
            this.setValue('');
            this.focus();
            console.log('global onClearTap');
        }
    });

http://jsfiddle.net/QYJpc/46/

score 0 · Accepted Answer · answered Oct 10 '13 at 08:16

0

An even nicer solution (works with touch 2.3.0) :

Ext.define('MyApp.override.field.Text', {
    override: 'Ext.field.Text',
    // @private
    doClearIconTap: function(me, e) {
        me.setValue(this.originalValue);

        me.focus();

        //sync with the input
        me.getValue();
    }
});

answered Oct 10 '13 at 08:16

Nicolas Trichet

204
2
9

true, and possibly make an extra class file for this in a map overrides. – andy Jan 19 '14 at 15:06

Override a system event: textfield clear

2 Answers2