Как динамически вызвать щелчок поля ввода файла в ExtJS?

Question

У меня есть кнопка в dataview, по нажатию которой я должен открыть файл. Я попробовал приведенный ниже код, который, кажется, работает нормально с Ext JS modern SDK, но с классическим элементом el - null.

Ext.application({
name: 'Fiddle',

launch: function () {
    var panel = Ext.Viewport.add({
        xtype: 'panel',
        title: 'FileInput Field Trigger',
        itemId: 'Mypanel',
        items: [{
            xtype: 'button',
            text: 'Upload file',
            listeners: {
                tap: function (button) {
                    // Find the fileinput field
                    var panel = button.up('#Mypanel');
                    var fileinput = panel.down('#myFileInputField');

                    // Programmatically click the file input field
                    fileinput.el.query('input[type=file]')[0].click();
                }
            }
        }, {
            xtype: 'formpanel',
            hidden: true,
            items: [{
                xtype: 'filefield',
                itemId: 'myFileInputField',
                listeners: {
                    change: function (field, newValue, oldValue, eOpts) {
                        Ext.Msg.alert('Results', newValue);
                    }
                }
            }]
        }]
    });
}
});

Есть ли способ вызвать это событие или любой другой подход, пожалуйста.

Answer 1

Если вы помещаете вышеупомянутый код в классический SDK, то есть некоторые вещи, которые немного отличаются от современных SDK:

Форма xtype в Classic - это просто 'form', а не 'formpanel'

В Classic нет события tap для кнопок, просто handler, которое выполняется при нажатии кнопки:

items: [{
        xtype: 'button',
        text: 'My Button',
        handler: function(button) {
            console.log('you clicked the button ', button);
        }
}]

Оформление рабочего Скрипка