Question

我有一个带分页的网格。当我设置过滤器时，ajax请求成功执行，json返回值看起来很好，过滤后的行出现在我的网格中。

但 Loading ... 弹出窗口不会消失，Firebug会在 ext-all-debug.js 中报告错误： TypeError：数据为空（第134684行）。那时的代码是：

data = store.getData();
items = data.items; // error

我已经多次检查了我的JS，但我找不到问题。

不幸的是我无法创建一个小提琴，因为我使用远程过滤。所以这是脚本：

Ext.onReady (function () {
  Ext.define('FooModel', {
    extend: 'Ext.data.Model',
    fields: [
      { name: 'myId', type: 'int' },
      { name: 'myDate', type: 'date', dateFormat: 'Y-m-d H:i:s' },
      { name: 'myString', type: 'string' },
      { name: 'myFilename', type: 'string' },
      { name: 'myUser', type: 'string' }
    ]
  });

  Ext.define('FooStore', {
    extend: 'Ext.data.Store',
    model: 'FooModel',

    autoLoad: true,
    autoDestroy: true,

    proxy: {
      type: 'ajax',
      url: 'test.php',
      reader: {
        type: 'json',
        rootProperty: 'import_files',
        messageProperty: 'error',
      }
    },

    remoteFilter: true,
    remoteSort: true,
    sorters: [{
      property: 'myId',
      direction: 'ASC'
    }],
    pageSize: 5
  });

  var theFooStore = new FooStore();

  theFooStore.load({
    callback: function(records, operation, success) {
      if(!success) {
        Ext.Msg.alert('Error', operation.getError());
      }
    }
  });

  Ext.define('FooGrid', {
    extend: 'Ext.grid.Panel',
    xtype: 'grid-filtering',
    requires: [ 'Ext.grid.filters.Filters' ],

    width: 1000,
    height: 700,
    renderTo: 'content',
    plugins: 'gridfilters',

    emptyText: 'No Matching Records',
    loadMask: true,
    stateful: true,

    store: theFooStore,
    defaultListenerScope: true,

    columns: [
      { dataIndex: 'myId', text: 'My Id', filter: 'number' },
      { xtype: 'datecolumn', dataIndex: 'myDate', text: 'My Date', renderer: Ext.util.Format.dateRenderer('d.m.Y'), filter: true },
      { dataIndex: 'myString', text: 'My String', filter: 'list' },
      { dataIndex: 'myFilename', text: 'My Filename',
        renderer: function(value, meta, record) {
          return Ext.String.format('<a href="test.php?download={0}">{1}</a>', record.data.myId, value);
        },
        filter: {
          type: 'string',
          itemDefaults: { emptyText: 'Search for...' }
        }
      },
      {
        dataIndex: 'myUser', text: 'My User',

        filter: {
          type: 'string',
          itemDefaults: { emptyText: 'Search for...' }
        }
      },
    ],

    dockedItems: [{
      xtype: 'pagingtoolbar',
      store: theFooStore,
      dock: 'bottom',
      displayInfo: true
    }]
  });

  new FooGrid();
});

这是一个示例json返回值：

{
  "success" : true,
  "total" : 19,
  "import_files" : [{
    "myId" : "1",
    "myFilename" : "foo bar.xlsx",
    "myDate" : "2015-05-19 13:23:21",
    "myUser" : "ABC",
    "myString" : "Lorem ipsum"
  },
  ...
  ]
}

有人遇到过同样的问题吗？它会导致什么？

Answer 1

祝我好运。在发布问题后不久找到答案。

在我的 My String 列中删除filter: 'list'选项是解决方案。

TypeError：在Ext JS 5.1上进行远程过滤时，data为null

1 个答案: