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。它也是一个字段，并从中继承了所有属性。

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

1 个答案: