对于文本字段没有焦点的听众是什么

Question

我知道这是一个愚蠢的问题，

对于文本字段没有焦点我应该使用哪个监听器？它是模糊吗？

我试过了，请问任何人只是让我的语法正确或者我做错了什么。并纠正它。会很棒的。

如何使用它，任何人都可以尝试一个简单的小提琴，也可以尝试已经可用的小提琴，

https://fiddle.sencha.com/#view/editor&fiddle/1ro8

谢谢你。

Ext.application({
    name: 'Fiddle',

    launch: function () {
        run();
    }
});

function run() {
    var myStore=Ext.create('Ext.data.Store', {
        storeId: 'simpsonsStore',
        fields: ['busname', 'time', 'typebus',],
        pageSize:2,
        proxy: {
           type: 'memory',
          enablePaging: true
    },
        data: [{
            busname: 'ABCD',
            time: '15:30:00',
            typebus: 'AC Volvo',

        }, {
            busname: 'aaa',
            time: '13:30:00',
            typebus: 'Seater',

        },{
            busname: 'AAAA',
            time: '18:30:00',
            typebus: 'Sleeper',

        },{
            busname: 'ABCD',
            time: '19:30:00',
            typebus: 'AC Volvo',

        },]
    });

    Ext.create('Ext.grid.Panel', {
        xtype :'gridpanel',
        itemId:'busTimegrid',
        pageSize:1,
        title: 'BUS DEATILS',
        mapperId:'getBusTime',
        store: Ext.data.StoreManager.lookup('simpsonsStore'),
        columns: [{
            header: 'Bus Name',
            dataIndex: 'busname',
            editor: 'textfield'
        }, {
            text: 'Bus Time',
                dataIndex: 'time',
            xtype: 'gridcolumn',
            renderer: function (value) {
                if (value instanceof Date)
                    return Ext.util.Format.date(value, 'H:i:s');
                else
                return value;
            },
            flex: 1,
            editor: {
                xtype: 'timefield',
                format: 'H:i:s',
                allowBlank: true,
                maskRe: /[0-9,:]/,
            }
        }, {
            header: 'Bus TYpe',
            dataIndex: 'typebus',
            editable:true,
            renderer: function (value) {
                if (Ext.isNumber(value)) {
                    var store = this.getEditor().getStore();
                    return store.findRecord('id', value).get('name');
                }
                return value;
            },
            editor: {
                xtype: 'combo',
                displayField: 'name',
                valueField: 'id',
                editable:true,
                forceSelection:true,
                store: Ext.create('Ext.data.Store', {
                    fields: ['id', 'name'],
                    data: [{
                        id: 1,
                        name: 'AC Volvo'
                    }, {
                        id: 2,
                        name: 'Seater'
                    }, {
                        id: 3,
                        name: 'Sleeper'
                    }]
                })

            }
        }],
        selModel: 'cellmodel',
        plugins: {
            ptype: 'cellediting',
            clicksToEdit: 1,
        },
        height: 200,
        width: 400,
            dockedItems: [{
            xtype: 'pagingtoolbar',
            store: myStore,   // same store GridPanel is using
            dock: 'bottom',
            displayInfo: true
        }],
        renderTo: Ext.getBody()
    });

    init:function(application){
        this.control({
            'Fiddle textfield#busname':{
                blur:this.onFieldBlur
            }
        });
    }
    onFieldBlur:function(textfield, event, options) {
    textfield.setValue(textfield.getValue().toUpperCase());
}

Answer 1

您要查找的选择器是textfield[dataIndex=busname]。但是我不会继续这条路线，而是使用grid /'roweditor / celleditor OR even Model.Field :: convert`装饰。

你的小提琴应该是这样的，尽管写ext这样的代码并不是一个好习惯;）

var myStore=Ext.create('Ext.data.Store', {
    storeId: 'simpsonsStore',
    fields: ['busname', 'time', 'typebus',],
    pageSize:2,
    proxy: {
       type: 'memory',
      enablePaging: true
},
    data: [{
        busname: 'ABCD',
        time: '15:30:00',
        typebus: 'AC Volvo',

    }, {
        busname: 'aaa',
        time: '13:30:00',
        typebus: 'Seater',

    },{
        busname: 'AAAA',
        time: '18:30:00',
        typebus: 'Sleeper',

    },{
        busname: 'ABCD',
        time: '19:30:00',
        typebus: 'AC Volvo',

    },]
});

function run（）{

  Ext.create('Ext.grid.Panel', {
    xtype :'gridpanel',
    itemId:'busTimegrid',
    pageSize:1,
    title: 'BUS DEATILS',
    mapperId:'getBusTime',
    store: myStore,
    columns: [{
        header: 'Bus Name',
        dataIndex: 'busname',
        editor: 'textfield'
    }, {
        text: 'Bus Time',
            dataIndex: 'time',
        xtype: 'gridcolumn',
        renderer: function (value) {
            if (value instanceof Date)
                return Ext.util.Format.date(value, 'H:i:s');
            else
            return value;
        },
        flex: 1,
        editor: {
            xtype: 'timefield',
            format: 'H:i:s',
            allowBlank: true,
            maskRe: /[0-9,:]/,
        }
    }, {
        header: 'Bus TYpe',
        dataIndex: 'typebus',
        editable:true,
        renderer: function (value) {
            if (Ext.isNumber(value)) {
                var store = this.getEditor().getStore();
                return store.findRecord('id', value).get('name');
            }
            return value;
        },
        editor: {
            xtype: 'combo',
            displayField: 'name',
            valueField: 'id',
            editable:true,
            forceSelection:true,
            store: Ext.create('Ext.data.Store', {
                fields: ['id', 'name'],
                data: [{
                    id: 1,
                    name: 'AC Volvo'
                }, {
                    id: 2,
                    name: 'Seater'
                }, {
                    id: 3,
                    name: 'Sleeper'
                }]
            })

        }
    }],
    selModel: 'cellmodel',
    plugins: {
        ptype: 'cellediting',
        clicksToEdit: 1,
    },
    height: 200,
    width: 400,
        dockedItems: [{
        xtype: 'pagingtoolbar',
        store: myStore,   // same store GridPanel is using
        dock: 'bottom',
        displayInfo: true
    }],
    renderTo: Ext.getBody()
});

this.control({
        'textfield[dataIndex=busname]':{
            blur:function(textfield, event, options) {
                debugger;
                textfield.setValue(textfield.getValue().toUpperCase());
            }
        }
    });

}

Ext.application（{     名称：'小提琴'，

launch: function () {
    run.apply(this,[]);
}

}）;