关于EXT gridPanel进行高级查询时load提交后台乱码以及其他方式更新store的方法及遇到的问题

Posted 2020-08-14 Gould-Zhang

Ext.data.Store  加载数据的几个方法及注意的事项

下面为定义的Store

var ds_edisCommonUser = new Ext.data.uStore({
    storeId:‘edisCommonUser‘,
    model:‘Edis_CommonUser‘,
    pageSize:itemPerPage,
    autoLoad:false,
    proxy:{
        type:‘ajax‘,
        method:‘POST‘,
        url:‘EdisCommonUser/getUsers.action‘,
        reader:{
            type:‘json‘,
            root:‘jsonObj_listUsers‘,
            totalProperty:‘jsonObj_listUsersCount‘
        }
    }
});

 

需求为：在高级查询完毕后，列表显示查询后的数据。

　　　　这里初次做的时候遇到个问题，是如果用load进行数据的重载，传入给action的参数会有乱码，这个是由于store更新数据的方式造成的，默认提交方法为get，需要重新给Store设置提交方式的属性

ds_edisCommonUser.load({
                    params:{
                        start:0,
                        limit:15,
                        name:search_name
                    }
                });

var ds_edisCommonUser = new Ext.data.uStore({
    storeId:‘edisCommonUser‘,
    model:‘Edis_CommonUser‘,
    pageSize:itemPerPage,
    autoLoad:false,
    proxy:{
        type:‘ajax‘,
        method:‘POST‘,
        url:‘EdisCommonUser/getUsers.action‘,

        actionMethods:{
            read:‘POST‘
        },

        reader:{
            type:‘json‘,
            root:‘jsonObj_listUsers‘,
            totalProperty:‘jsonObj_listUsersCount‘
        }
    }
}););

关于store更新数据乱码问题到此结束

 

在初次遇到此乱码问题时，我不知道用load方法的重要性（为何重要要在下面叙述），我采用的方式为Ext.ajax.Request获取数据，并将store更换数据的方式完成数据的高级查询

loadData方法，可以将查询后的数据更新至gridPanel列表中，但是不能更新页码
* 总页数还是之前全部查询的总页数，因此分页查询功能失效。
* 后来在firefox中发现gridPanel中有个TotalCount的属性，该属性为列表
* 的总页数，但是gridPanel中并没有设置此属性的方法，因此我通过
* define一个新的Ext类继承EXT.DATA.STORE的方式，加入了此方法，
* 不过经过试验确实能在debug时，
* 确实能对girdPanel的TotalCount属性进行更改，但是还是无法对页面的
* GridPanel右下角的总数进行更新，所以怀疑是girdPanel没有进行刷新，
* 仅进行数据的刷新，通过资料查找，能刷新girdPanel的仅能是load()方法

 

 1 var test_data = Ext.Ajax.request({
 2                     url:‘EdisCommonUser/getUsers.action‘,
 3                     method:‘POST‘,
 4                     params:{
 5                         name:search_name,
 6                         start:0,
 7                         limit:15
 8                     },
 9                     success:function(data){
10                         var _jsondata = Ext.JSON.decode(data.responseText);
11                         var _jsonStore = _jsondata.jsonObj_listUsers;
12                         var _jsonTotalProperty = _jsondata.jsonObj_listUsersCount;
13                         
14                         ds_edisCommonUser.load({
15                             params:{
16                                 
17                             }
18                         })
19                     
20                         /*    下面为通过loadData的方式
21                          *         loadData方法，可以将查询后的数据更新至gridPanel列表中，但是不能更新页码
22                          *         总页数还是之前全部查询的总页数，因此分页查询功能失效。
23                          *         后来在firefox中发现gridPanel中有个TotalCount的属性，该属性为列表
24                          *         的总页数，但是gridPanel中并没有设置此属性的方法，因此我通过
25                          *         define一个新的Ext类继承EXT.DATA.STORE的方式，加入了此方法，
26                          *         不过经过试验确实能在debug时，
27                          *         确实能对girdPanel的TotalCount属性进行更改，但是还是无法对页面的
28                          *         GridPanel右下角的总数进行更新，所以怀疑是girdPanel没有进行刷新，
29                          *         仅进行数据的刷新，通过资料查找，能刷新girdPanel的仅能是load()方法
30                          * */
31                         ds_edisCommonUser.loadData(_jsonStore);
32                         ds_edisCommonUser.setTotalCount(_jsonTotalProperty);
33                         /*
34                             _searchProxy 是为了更新 gridPanel中proxy中的totalProperty属性，
35                             不过更新也无法对页面中girdPanel的页码进行更新
36                         */
37                         _searchProxy = new Ext.data.proxy.Proxy({
38                             reader:{
39                                 totalProperty:_jsonTotalProperty
40                             }
41                         });
42                         ds_edisCommonUser.setProxy(_searchProxy);
43 
44                     },
45                     error:function(data){
46                         alert(‘ww‘)
47                     }
48                     
49                 })