Question

我正在使用ListFilter插件来过滤Grid面板上的结果。列定义是。

{
    header: 'Provider',
    filter: {
        type: 'list',
        store: Ext.getStore('MyApp.store.Provider'),
        dataIndex: 'provider_id',
        labelField: 'name'
    }
}

MyApp.store.Provider创建为

   Ext.create('Ext.data.Store', {
        storeId: 'MyApp.store.Provider',
        autoDestroy: true,
        autoLoad: {start: 0, limit: 50},
        autoSync: true,
        model: 'MyApp.model.Provider',
        pageSize: 50,
        proxy: {
            type: 'ajax',
            api: {
                create:  'proxy/provider/create',
                read:    'proxy/provider/read',
                update:  'proxy/provider/update',
                destroy: 'proxy/provider/destroy'
            },
            reader: {
                type: 'json',
                root: 'data',
                successProperty: 'success',
                messageProperty: 'message',
                totalProperty: 'total'
            },
            writer: {
                allowSingle: false,
                type: 'json',
                writeAllFields: false,
                root: 'data'
            }
        }
    });

最后，模型MyApp.model.Provider被定义为

Ext.define('MyApp.model.Provider', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'provider_id', type: 'int'},
        'name',
        { name: 'create_time', type: 'date', dateFormat: appDateFormat },
        { name: 'status', type: 'int'}
    ],
    idProperty: 'provider_id',
    displayProperty: 'name' // A custom property used for dynamically use the property to display
})

现在此代码未在过滤器菜单中显示任何子菜单。它只显示加载。看图像。

shows loading

更新

我使用以下过滤器配置解决了它。这实际上是手动填充options配置。所以这里没有使用store。

{
  type: 'list',
  labelField: 'name',
  options: (function () {
    var opts = [];
    fS.load(function (records, operation, success) {
      for (var i = 0; i < records.length; i++) {
        var ar = {
          id: records[i].get('provider_id'),
          name: records[i].get('name')
        };

        opts.push(ar);
      }
    });
    return opts;
  })(),
  single: true
}

似乎'id'是硬编码的。 id: records[i].get('provider_id'),看起来不太好。虽然它有效。

但我仍在寻找一种合适的方法。

注意：可以在ExtJS 4.1.1上找到预期的行为。见jsfiddle。我已经复制了它。但是同样的事情对ExtJS 4.0.7

无效

Answer 1

我自己没有尝试过，但你需要手动设置ID idField property [ ExtJS4.1.3的新手 ]默认设置为id。所以我想这会奏效：

{
    header: 'Provider',
    filter: {
        type: 'list',
        idField: 'provider_id',
        store: Ext.getStore('MyApp.store.Provider'),
        dataIndex: 'provider_id',
        labelField: 'name'
    }
}

<强>更新

好的，我查看了源代码，我现在可以告诉你这就是答案。所以必须要么与你的workarround一起生活，直到4.2出来，或者你可以对你的Ext.ux.grid.menu.ListMenu应用以下更改以使其运行：

使用默认值添加idField。

在构造函数中查找此行

case 'object': options.push([value.id, value[this.labelField]]); break;
// some more lines
fields: ['id', this.labelField],

并将其替换为

case 'object': options.push([value[me.idField], value[me.labelField]]); break;
// some more lines
fields: [me.idField, me.labelField],

并在onLoad函数中查找

itemValue = records[i].get('id');

并将其替换为

itemValue = records[i].get(me.idField);

那就是它。

在ExtJS网格列标题中使用ListFilter进行远程过滤

更新

1 个答案: