extjs - 搜索值不会加载带有搜索数据的视图 [Shopware 5]

Question

我创建了一个后端窗口并添加了搜索功能。

每当我搜索任何值时，让我们说ExtJS 中5004的console.log(store.data.items)更改事件首先显示所有结果

然后，如果我搜索任何其他值，例如5007. 然后在console.log(store.data.items)其中显示5004控制台选项卡中的先前结果

网络选项卡显示 PHP 端带来了正确的结果，但在 ExtJs 上，我无法在网格中反映搜索到的数据。

这是我的代码结构

资源/视图/后端/my_test_module/app.js

Ext.define('Shopware.apps.MyTestModule', {
    extend: 'Enlight.app.SubApplication',

    name:'Shopware.apps.MyTestModule',

    loadPath: '{url action=load}',
    bulkLoad: true,

    controllers: [
        'Main',
        'Filter'
    ],

    views: [
        'list.Window',
        'list.List'
    ],

    models: [ 'MyTestModule' ],
    stores: [ 'MyTestModule' ],

    launch: function() {
        return this.getController('Main').mainWindow;
    }
});

资源/视图/后端/my_test_module/controller/filter.js

Ext.define('Shopware.apps.MyTestModule.controller.Filter', {

    extend:'Ext.app.Controller',

    init:function () {
        var me = this;

        me.control({
            'my-test-module-listing-grid textfield[action=searchTicket]': {
                searchTicket: me.onSearchTicket
            }
        });
        me.callParent(arguments);
    },

    onSearchTicket: function (value) {
        var me = this,
            store = me.getStore('MyTestModule');

        var searchString = Ext.String.trim(value);

        // scroll the store to first page
        store.currentPage = 1;

        // If the search-value is empty, reset the filter
        if (searchString.length === 0) {
            store.clearFilter();
        } else {
            // This won't reload the store
            store.filters.clear();
            // Loads the store with a special filter
            store.filter('searchValue', searchString);

        }

        console.log(store.data.items);  
    }
});

资源/视图/后端/my_test_module/model/my_test_module.js

Ext.define('Shopware.apps.MyTestModule.model.MyTestModule', {
    extend: 'Ext.data.Model',

    fields: [
        { name : 'id', type: 'int' },
        { name : 'some_field_one', type: 'string' },
        { name : 'order_number', type: 'string' },
        { name : 'ticket_number', type: 'string' },
        { name : 'some_field_two', type: 'string' },
        { name : 'some_field_three', type: 'string' }
    ],

    /**
     * Configure the data communication
     * @object
     */
    proxy: {
        type: 'ajax',

        /**
         * Configure the url mapping for the different
         * store operations based on
         * @object
         */
        api: {
            read: '{url controller="MyTestModule" action="list"}',
            update: '{url controller="MyTestModule" action="update"}',
        },

        /**
         * Configure the data reader
         * @object
         */
        reader: {
            type: 'json',
            root: 'data',
            totalProperty: 'total'
        }
    }
});

资源/视图/后端/my_test_module/store/my_test_module.js

Ext.define('Shopware.apps.MyTestModule.store.MyTestModule', {
    extend: 'Ext.data.Store',

    pageSize: 10,
    remoteFilter: true,
    remoteSort: true,

    autoLoad: true,

    /**
     * Define the used model for this store
     * @string
     */
    model: 'Shopware.apps.MyTestModule.model.MyTestModule'
});

有什么线索吗？

Answer 1

对于我上面的案例，这种稍加修改的方法对我有用。

如何在 extjs4.1 中刷新或重新加载面板视图

我所做的只是在我Resources/views/backend/my_test_module/controller/filter.js的onSearchTicket()

我添加了这一行

Ext.ComponentQuery.query('my-test-module-listing-grid')[0].store.filter('searchValue', searchString);

所以现在看起来像这样

onSearchTicket: function (value) {
        var me = this,
            store = me.getStore('MyTestModule');

        var searchString = Ext.String.trim(value);

        // scroll the store to first page
        store.currentPage = 1;

        // If the search-value is empty, reset the filter
        if (searchString.length === 0) {
            Ext.ComponentQuery.query('my-test-module-listing-grid')[0].store.clearFilter();
        } else {
            // otherwise filter the store with filtered value
            Ext.ComponentQuery.query('my-test-module-listing-grid')[0].store.filter('searchValue', searchString);
        }
    }

并且Ext.ComponentQuery.query()可以在这个答案中找到解释

https://stackoverflow.com/a/35193444/7473771