ExtJS 如何从自定义组件创建自定义字段

Question

我有我的应用程序 (ExtJS 4.2.1) 并且我有一个表单：

xtype: 'form',
    bodyPadding: 10,
    autoScroll: false,
    itemId: 'editForm',
    defaults: { 
        msgTarget: 'side',
        xtype: 'textfield'
    },
    //layout:'anchor',
    items: [{
            xtype: 'combobox',
            itemId: 'cboEmployer',
            store: Ext.create('App.store.catalog.Employer', {
                autoLoad: true
            }),
            displayField: 'Description',
            valueField: 'EmployerId',
            fieldLabel: 'Company',
            name: 'EmployerId',
            queryMode: 'local',
            allowBlank: false,
        },{
            xtype: 'radiogroup',
            fieldLabel: 'Type',
            name: 'RequestInAdvance',
            columns: 2,
            items: [{
                    boxLabel: 'Normal',
                    name: 'RequestInAdvance',
                    inputValue: 0,
                    checked: true
                }, {
                    boxLabel: 'Advanced',
                    name: 'RequestInAdvance',
                    inputValue: 1
                }

            ]
        }, {

            xtype: 'fieldset',
            title: 'Date selection',
            defaults: {
                labelWidth: 89,
                anchor: '100%',
                layout: {
                    type: 'hbox',
                    defaultMargins: {
                        top: 0,
                        right: 5,
                        bottom: 0,
                        left: 0
                    }
                }
            },
            items: [{
                xtype: 'highlightdate', // <- This is a custom datepicker but I need it to be a field type
                name: 'SelectedDates',
                itemId: 'datePicker'
            }],

        },

    ],
    buttons: [{
        text: 'Save',
        action: 'commit',
        glyph: Glyphs.SAVE,
        disabled: true
    }],

xtype: 'highlightdate' 是一个自定义日期选择器，我需要进行自定义表单验证，以便将元素标记为错误：

在我的验证方法中，我有：

    var fieldMatch = Ext.ComponentQuery.query('field[name=' + error.field + ']');
 if (fieldMatch.length) {
                // add extra validaiton message to the offending field
                fieldMatch[0].markInvalid(error.message);
            }

所以当我尝试为我的highlightdate xtype 设置错误时，可以发现它不是field。

有没有办法解决这个问题？

Answer 1

xtype 只是自定义“highlightdate”类的简称，可以用new Namespace.CustomClass({cfg}) 表示法代替。你需要弄清楚的是：这个自定义类扩展了什么基类？如果它扩展 Ext.form.field.Base 或 Ext.form.field.Text 为 ex。而不是它也是一个字段并继承它的所有属性。