Question

美好的一天！

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

与 Ext.ux.grid.filter.StringFilter （ux / grid / filter）类比，创建了一个新类 Ext.ux.grid.filter.StringFilterRC ，仅限ComboBox
这个上限：

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',
-----------------------------------------
});

我刚刚更换了它。是的，但弄清楚了面额的冲突是什么只要你有空闲时间了解。一切都很好

（作为一个笑话获得：父亲的合适程序员儿子并问：“爸爸，为什么每次太阳升起在东方，”父亲，“你每天都在检查”是“的儿子”是的，检查“父亲：”为了上帝的缘故，不要触摸我的儿子，不要改变任何东西，仍在工作“）

ExtJS在FiltersFeature中添加新数据类型

1 个答案: