添加文本字段和按钮以使用extjs进行网格单元格编辑 [英] add textfield and button for grid cell edit with extjs

问题描述

我想使用extjs网格单元格编辑功能，除了文本字段，日期选择器之外，我还需要一个带有右侧按钮的文本字段来触发选择列表模式窗口.看起来像日期选择器，它的右侧文本字段中有一个日历图标.

I'd like to use extjs grid cell edit function, besides textfield, datepicker, I also need a textfield with a button in the right to trigger a picklist modal window. It looks like to datepicker which has a calendar icon in a textfield in the right.

我尝试用fieldcontainer将文本字段和按钮组合在一起，但是，它不起作用.非常感谢您的帮助！

I tried fieldcontainer to combine a textfield with a button, however, it doesn't work. Thanks a lot for help!

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'}]

推荐答案

您可以使用

You could either use a trigger field and implement your picker logic in the onTriggerClick method or define your own field by extending Ext.form.field.Picker, which is an abstract class for fields that show a picker on trigger click and therefore already provides some of the logic (such as displaying the picker under the trigger).

如果您查看日期字段的类层次结构，将会看到这些类之间的关系:

If you have a look at the class hierarchy of the datefield you will see how those classes are related:

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

这篇关于添加文本字段和按钮以使用extjs进行网格单元格编辑的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！