Extjs 项目中常用的小技巧，也许你用得着(5)--设置 Ext.data.Store 传参的请求方式

1.extjs 给怎么给panel设背景色

设置bodyStyle:'background:#ffc;padding:10px;',

var resultsPanel = Ext.create('Ext.panel.Panel', {
    title: 'Results',
    width: 600,
    height: 400,
    renderTo: Ext.getBody(),
    bodyStyle: 'background:#ffc; padding:10px;',
    layout: {
        type: 'vbox',       // Arrange child items vertically
        align: 'stretch',    // Each takes up full width
        padding: 5
    },
    items: [{               // Results grid specified as a config object with an xtype of 'grid'
        xtype: 'grid',
        columns: [{header: 'Column One'}],            // One header just for show. There's no data,
        store: Ext.create('Ext.data.ArrayStore', {}), // A dummy empty data store
        flex: 1                                       // Use 1/3 of Container's height (hint to Box layout)
    }, {
        xtype: 'splitter'   // A splitter between the two child items
    }, {                    // Details Panel specified as a config object (no xtype defaults to 'panel').
        title: 'Details',
        bodyPadding: 10,
        items: [{
            fieldLabel: 'Data item',
            xtype: 'textfield'
        }], // An array of form fields
        flex: 2             // Use 2/3 of Container's height (hint to Box layout)
    }]
});

2. Extjs4.0 设置 Ext.data.Store 传参的请求方式

var Store = Ext.create('Ext.data.Store', {
    pageSize: pageSize,
    model: 'Ext.data.Model名称',
    autoLoad: false,
    proxy: {
        type: 'ajax',
        url: '请求路径',
        getMethod: function(){ return 'POST'; },//亮点，设置请求方式,默认为GET
        reader: {
            type: 'json',
            root: 'Data',
            totalProperty: 'totalCount'
        }
    },
    listeners: {
        'beforeload': function (store, op, options) {
            var params = {
                //参数
            };
            Ext.apply(store.proxy.extraParams, params);
        }
    }
});  

3.ExtJS grid 带参数查询分页 store 传额外参数解决办法

在store的beforeload事件里面重写store.proxy.extraParams，添加新参数

就不必每次都手动的添加参数

store.on('beforeload', function (store, options) {
        var new_params = { name: Ext.getCmp('search').getValue() };
        Ext.apply(store.proxy.extraParams, new_params);
        // alert('beforeload');
    });
在Extjs3 中的
store.on('beforeload', function () {
            store.baseParams = {
                name: '5555555',
                intss: '666666666'
            };
        }); 

下面给出完整的代码。原理很简单，将搜索条件放在store的baseParams中，每次加载都赋值。

只是需要强制赋值，因为默认的pagetoolbar只会把start、limit、page、sort、dir传递给store。

var store = new Ext.data.Store({
       pageSize: GridPageSize,
       model: 'Master',
       autoLoad: false,
       proxy: {
           type: 'ajax',
           url: '/master/GetMasterData',
           reader: {
               type: 'json',
               root: 'data',
               totalProperty: 'totalCount'
           }
       },
       fields: [
           { name: 'Id' },
           { name: 'Master_Name' }  

       //排序
       sorters: [{
           property: 'Master_Name',
           direction: 'DESC'
       }]   

   });
store.on('beforeload', function (store, options) {
        var new_params = { name: Ext.getCmp('search').getValue() };
        Ext.apply(store.proxy.extraParams, new_params);
        // alert('beforeload');
    });
store.load({
       params: { start: 0, limit: GridPageSize }
   })