Как отобразить поле файла в ячейке сетки в ExtJS

Я создал сетку в форме и динамически отображаю записи, и я использую редактор ячеек для редактирования столбца комментариев и в другом столбце, используя поле файла, для просмотра файла и отображения его полного пути в столбце вложения. Посмотрите код, который я использую:

                  {
                        xtype: 'container',
                        flex: 1,
                        layout: {
                            type: 'fit'
                        },
                        items: [
                            {
                                xtype: 'grid',
                                itemId: 'myAttachGrid',
                                reference: 'myAttachGrid ',
                                store: Ext.create('JSSample.store.attach.MyAttachGrid'),
                                multiSelect: true,
                                autoScroll: true,
                                columnWidth: 1,
                                editable: true,
                                columnLines: true,
                                plugins: [
                                    Ext.create('Ext.grid.plugin.CellEditing', {
                                        clicksToMoveEditor: 1,
                                        autoCancel: false
                                    })
                                ],
                                columns: [
                                    {
                                        header: 'File', dataIndex: 'Attachments', width: '40%'
                                    },                                        
                                    {
                                        header: '',
                                        dataIndex: '',
                                        width: '10%',
                                        hideable: true,
                                        editor: {
                                            xtype: 'filefield',
                                            labelWidth: 50,
                                            msgTarget: 'side',
                                            buttonOnly: true,
                                            anchor: '100%',                                                
                                            buttonText: '...',
                                            listeners: {
                                                change: function (fld, value) {
                                                    alert(value.replace(/C:\\fakepath\\/g, ''));
                                                }
                                            }
                                        }
                                    },                                      

                                    {
                                        header: 'Comments', dataIndex: 'Comments', width: '50%', editor: 'textfield'
                                    }
                                ]
                            }
                        ]
                    }

После загрузки записи сетки отображаются динамически следующим образом:

введите здесь описание изображения

Теперь моя проблема в том, что поле файла отображается после двойного щелчка по ячейке. [ниже скриншот]:

введите здесь описание изображения

Итак, я хочу видеть поле файла с записями [без двойного щелчка по ячейке].


person TARUN KUMAR    schedule 18.12.2016    source источник
comment
Укажите используемую версию ExtJS. В ExtJS 6 есть widgetcolumn доступны, которые должны делать то, что вы хотите.   -  person Alexander    schedule 18.12.2016
comment
Я использую - Ext JS 6.0.2.437   -  person TARUN KUMAR    schedule 19.12.2016


Ответы (1)


Как отметил @alexander в комментарии, с ExtJS 6 вы можете использовать Ext.grid.column.Widget, чтобы добавить поле файла в сетку.

Проверьте, например, эту скрипку.

person Sergey Novikov    schedule 19.12.2016
comment
Спасибо за помощь. но теперь мы получаем новую ошибку, когда очищаем сетку с помощью store.removeAll(), получая следующую ошибку: Uncaught TypeError: focusEl.isTabbable не является функцией - person TARUN KUMAR; 29.12.2016