Ext JS 4.2数据字段转换覆盖不起作用

Question

I'm trying to write an override which would be called upon each model field convert function. I'm trying to make sure each field gets saved without HTML tags. If I put my code in a single convert function it works. But the override looks like it is never called.

Ext.define('hds.override.data.Field', {
override: 'Ext.data.Field',
        constructor: function(config) {
    var me = this;
    this.convert = config.convert || function(v) {
        // Do something with v and return it
        console.log('Process value');
        v = Ext.util.Format.stripTags(Ext.util.Format.stripScripts(v));
        return v;
    };
    this.callParent(arguments);
}
});

Answer 1

You just need to change order of this.callParent(arguments) like below example it will work.

//Override data field
Ext.define('hds.override.data.Field', {
    override: 'Ext.data.Field',
    constructor: function (config) {
        var me = this;
        me.callParent(arguments);
        me.convert = config.convert || function (v) {
            // Do something with v and return it
            console.log('Process value');
            v = Ext.util.Format.stripTags(Ext.util.Format.stripScripts(v));
            return v;
        };
    }
});

In this FIDDLE , I have created a demo using your code. I hope this will help you or guide you to solve your problem.

Code Snippet

//Override data field
Ext.define('hds.override.data.Field', {
    override: 'Ext.data.Field',
    constructor: function (config) {
        var me = this;
        me.callParent(arguments);
        me.convert = config.convert || function (v) {
            // Do something with v and return it
            console.log(`Process value for ${v}`);
            v = Ext.util.Format.stripTags(Ext.util.Format.stripScripts(v));
            return v;
        };
    }
});

Ext.create('Ext.data.Store', {
    storeId: 'simpsonsStore',
    fields: ['name', 'email', {
        name: 'phone',
        convert: function (v) {
            return `+91 ${v}`;
        }
    }],
    data: [{
        name: 'Lisa',
        email: 'lisa@simpsons.com',
        phone: '9898989898'
    }, {
        name: 'Bart',
        email: 'bart@simpsons.com',
        phone: '9898989898'
    }, {
        name: 'Homer',
        email: 'homer@simpsons.com',
        phone: '9898989898'
    }, {
        name: 'Marge',
        email: 'marge@simpsons.com',
        phone: '9898989898'
    }]
});

Ext.create('Ext.grid.Panel', {
    title: 'Simpsons',
    store: Ext.data.StoreManager.lookup('simpsonsStore'),
    columns: [{
        text: 'Name',
        flex: 1,
        dataIndex: 'name'
    }, {
        text: 'Email',
        dataIndex: 'email',
        flex: 1
    }, {
        flex: 1,
        text: 'Phone',
        dataIndex: 'phone'
    }],
    renderTo: Ext.getBody()
});