ExtJS 在 FiltersFeature 中添加新的数据类型

Question

美好的一天！

处理数据过滤器（FiltersFeature）。需要在过滤器中创建下拉列表。

类比Ext.ux.grid.filter.StringFilter（ux/grid/filter）创建了一个新类Ext.ux.grid.filter.StringFilterRC，仅使用组合框
那个上限这个类：

Ext.define('Ext.ux.grid.filter.StringFilterRC', {
extend: 'Ext.ux.grid.filter.Filter',
alias: 'gridfilter.stringRC',
---------

将过滤器重置为FiltersFeature：

var cnfFilter = {
    ftype: 'filters',
    autoReload: true,
    encode: true,
    local: false
};

连接到它的网格（Ext.grid.Panel）：features: [cnfFilter]

表格列的设置我写了以下内容：

this.columns = [
      {
       xtype:'rownumberer'
      },
    {text: 'Data1', sortable:true, width:150,  filter: {type: 'string'}, dataIndex:'RC'},
    {text: 'Data2', sortable:true, width:150, filter: {type: 'stringRC'}, dataIndex:'CodePost'}]

问题在于数据类型 - stringRC 缺失。

Ext.ux.grid.FiltersFeature的流程如下：

getFilterClass : function (type) {
    // map the supported Ext.data.Field type values into a supported filter
    switch(type) {
        case 'auto':
          type = 'string';
          break;
        case 'int':
        case 'float':
          type = 'numeric';
          break;
        case 'bool':
          type = 'boolean';
          break;
    }
    return Ext.ClassManager.getByAlias('gridfilter.' + type);
}

然后检查类型 stringRc 不是。事实证明，这里加载了有关过滤类型的所有数据：

createFiltersCollection: function () {
    return Ext.create('Ext.util.MixedCollection', false, function (o) {
        return o ? o.dataIndex : null;
    });
}

虽然我可能是错的。如何将数据类型添加到过滤器？请提示并为我的英语感到抱歉。

更新（stringRC的源代码）

源码类比Ext.ux.grid.filter.StringFilter

var storeData = Ext.create('Ext.data.Store', {
autoLoad: true,
idProperty: 'RC',
fields: ['RC', 'field1', 'field2', 'field3', 'field4', 'field5', 'field6', 'field7', 'field8', 'field9', 'field0'],
proxy: {
        type: 'direct',
        directFn: Ext.php.myPHPClass.myPHPFunction,
        reader: {
                  type: 'json',
                  root: 'data'
                }
       }
});

Ext.define('Ext.ux.grid.filter.StringFilterRC', {
    extend: 'Ext.ux.grid.filter.Filter',
    alias: 'gridfilter.stringRC', // new type alias

/**
 * @cfg {String} iconCls
 * The iconCls to be applied to the menu item.
 * Defaults to <tt>'ux-gridfilter-text-icon'</tt>.
 */
iconCls : 'ux-gridfilter-text-icon',

emptyText: 'Enter Filter Text...',
selectOnFocus: true,
width: 150,

/**
 * @private
 * Template method that is to initialize the filter and install required menu items.
 */
init : function (config) { // config for ComboBox
    Ext.applyIf(config, {
        enableKeyEvents: true,
        labelCls: 'ux-rangemenu-icon ' + this.iconCls,
        hideEmptyLabel: false,
        labelSeparator: '',

        typeAhead: true,
        queryMode: 'local',
        displayField: 'field1',

        store: storeData,


        listeners: {
            scope: this,
            keyup: this.onInputKeyUp,
            el: {
                click: function(e) {
                    e.stopPropagation();
                }
            }
        }
    });

    this.inputItem = Ext.create('Ext.form.field.ComboBox', config); 
    this.menu.add(this.inputItem);
    this.menu.showSeparator = false;
    this.updateTask = Ext.create('Ext.util.DelayedTask', this.fireUpdate, this);
},

/**
 * @private
 * Template method that is to get and return the value of the filter.
 * @return {String} The value of this filter
 */
getValue : function () {
    return this.inputItem.getValue();
},

/**
 * @private
 * Template method that is to set the value of the filter.
 * @param {Object} value The value to set the filter
 */
setValue : function (value) {
    this.inputItem.setValue(value);
    this.fireEvent('update', this);
},

/**
 * Template method that is to return <tt>true</tt> if the filter
 * has enough configuration information to be activated.
 * @return {Boolean}
 */
isActivatable : function () {
    return this.inputItem.getValue().length > 0;
},

/**
 * @private
 * Template method that is to get and return serialized filter data for
 * transmission to the server.
 * @return {Object/Array} An object or collection of objects containing
 * key value pairs representing the current configuration of the filter.
 */
getSerialArgs : function () {
    return {type: 'string', value: this.getValue()};
},

/**
 * Template method that is to validate the provided Ext.data.Record
 * against the filters configuration.
 * @param {Ext.data.Record} record The record to validate
 * @return {Boolean} true if the record is valid within the bounds
 * of the filter, false otherwise.
 */
validateRecord : function (record) {
    var val = record.get(this.dataIndex);

    if(typeof val != 'string') {
        return (this.getValue().length === 0);
    }

    return val.toLowerCase().indexOf(this.getValue().toLowerCase()) > -1;
},

/**
 * @private
 * Handler method called when there is a keyup event on this.inputItem
 */
onInputKeyUp : function (field, e) {
    var k = e.getKey();
    if (k == e.RETURN && field.isValid()) {
        e.stopEvent();
        this.menu.hide();
        return;
    }
    // restart the timer
    this.updateTask.delay(this.updateBuffer);
}
});

Answer 1

解决了问题。最初一切正常，问题在于别名的名称（别名：'gridfilter.stringRC'）：

Ext.define('Ext.ux.grid.filter.StringFilterRC', {
extend: 'Ext.ux.grid.filter.Filter',
alias: 'gridfilter.stringRC',
-----------------------------------------
});

我刚换了。确实，但弄清楚了教派的冲突是什么。
只要你有空闲时间去了解。所以一切都很好

（开玩笑获得：适合父亲的程序员儿子并问：“爸爸，为什么每次太阳从东方升起”，“父亲”，而您每天都在检查“儿子”是的，检查“父亲：”看在上帝的份上，不要碰我儿子，不要改变任何东西，仍在工作“）