ExtJS在具有不同参数的按钮单击事件上重新加载存储

Question

我是ExtJs的新手,我正在使用ExtJs4.

现在如下图所示,有一个名为keywords的文本域,我想要做的是当我点击按钮时它会将数据传递textfield给servlet并显示结果记录grid.

现在我不知道该怎么做.我从servlet接收JSON数据响应,但不知道如何重新加载存储并刷新网格.

下面是我的商店和网格的代码.

Ext.define("Post", {
    extend: 'Ext.data.Model',
    proxy: {
        type: 'ajax',
        url: '/ezdi/searchServlet',
        method: 'POST',
        reader: {
            type: 'json',
            root: 'rows'
            //,totalProperty: 'totalCount'
        }
    },

    fields: [{
        name: 'docid',
        mapping: 'docid'
    }, {
        name: 'mrn',
        mapping: 'mrn'
    }, {
        name: 'fname',
        mapping: 'fname'
    }]
});

var gridDataStore = Ext.create('Ext.data.Store', {
    model: 'Post'
});

// Data store for grid end

Ext.define('Ezdi.Grid', {
    extend: 'Ext.grid.GridPanel',
    alias: 'widget.ezdigrid',
    initComponent: function() {
        var config = {
            store: gridDataStore,
            columns: [{
                header: "DocID",
                width: 100,
                sortable: true,
                dataIndex: 'docid'
            }, {
                header: "MRN",
                width: 100,
                sortable: true,
                dataIndex: 'mrn'
            }, {
                header: "FirstName",
                width: 100,
                sortable: true,
                dataIndex: 'fname'
            }],
            viewConfig: {
                forceFit: false,
                autoLoad: false
            },
            loadMask: true
        };
    }
});

Answer 1

你可以使用：

{
    xtype: 'button',
    text: 'Search',
    handler: function() {
        store.clearFilter(); //clear previous search value
        var searchValue = Ext.getCmp("textFieldId").getValue(); //get new value 
        store.load().filter('jsonGridFielName', searchValue); //load filtered data
    }
}

对于多重textfield搜索：

//FILTERS
var searchValue1 = Ext.getCmp("textFieldId1").getValue(); //value1
var searchValue2 = Ext.getCmp("textFieldId2").getValue(); //value2
var noValue = "0000xxxx"; //no Value, for empty field, use value that you are sure it is not going to be searched!!!
var clear = store.clearFilter(); //shortcut

if (!searchValue1 && !searchValue2) {
    clear;
    store.load().filter("jsonGridFielName1", noValue);
} else if (searchValue1) {
    clear;
    store.load().filter('jsonGridFielName1', searchValue1);
    //...else if(searchValue n...)...
} else {
    clear;
    store.load().filter('jsonGridFielName2', searchValue2);
}