добавить текстовое поле и кнопку для редактирования ячейки сетки с помощью extjs

Question

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

Я попробовал полевой контейнер для объединения текстового поля с кнопкой, однако он не работает. Большое спасибо за помощь!

Ext.define('CellPicklist', { 
    extend: 'Ext.form.FieldContainer', 
    xtype: 'cell-picklist', 
    layout: 'hbox', 
    width: 200, 
    items: [{ 
      xtype: 'textfield', 
     }, { 
      xtype: 'button' 
     }] 
}); 

columns: [{dataIndex: 'id',hidden: true},{text: 'Name', dataIndex: 'name', flex: 1, editor: 'cell-picklist'}] 

Answer 1

Вы можете либо использовать trigger field и реализовать сборщик логику в методе onTriggerClick или определить собственное поле за счетом расширения Ext.form.field.Picker, который является абстрактным классом для полей, которые показывают сборщик на спусковых мышах и, следовательно, уже предоставляют некоторые логики (например, отображение сборщика под триггером).

Если вы посмотрите на класс иерархии DateField вы увидите, как связаны эти классы:

Ext.Base 
    Ext.AbstractComponent 
    Ext.Component 
     Ext.form.field.Base 
     Ext.form.field.Text 
      Ext.form.field.Trigger 
      Ext.form.field.Picker 
       Ext.form.field.Date