如何像日期选择器一样开发Extjs组件?

时间:2015-11-15 04:45:31

标签: extjs extjs6 extjs6-classic

我是ExtJs 6.0框架开发人员。

我想开发像date这样的组件,当用户点击它时,它会打开一个窗口,这个窗口有一些textfields和其他Extjs components。我的问题是当我想将此组件用作网格单元格编辑器时。它没有显示组件。换句话说,我想开发一个自定义选择器。

我该怎么做

1 个答案:

答案 0 :(得分:3)

您可以延长Ext.form.field.Picker并实施createPicker

  

具有单个触发器的字段的抽象类,用于打开a   字段下方的“选择器”弹出窗口,例如组合框菜单列表或日期   选择器。它提供了一个用于切换选择器的基本实现   单击触发器时的可见性以及键盘导航   和一些基本事件。拾取器的尺寸和对齐可以是   通过matchFieldWidth和pickerAlign / pickerOffset配置控制   属性分别。

     

您通常不会直接使用此类,而是将其用作   特定选择器字段实现的父类。   子类必须实现createPicker方法来创建选择器   适合该领域的组件。

它看起来像:

Ext.define('Fiddle.view.FooPicker', {

    extend: 'Ext.form.field.Picker',

    xtype: 'foo-picker',

    createPicker: function(){

        return Ext.widget('container',{
            padding: 20,
            floating: true,
            items: [
                {
                    xtype: 'textfield'
                },
                {
                    xtype: 'box',
                    html: 'Foo'
                }
            ]
        })

    }

});

https://fiddle.sencha.com/#fiddle/1139