1.除了引入ext-all.js外,另需引入扩展组件.
<script type="text/javascript" > Ext.Loader.setConfig({enabled: true}); Ext.Loader.setPath('Ext.ux', webroot+'/web/elane/ext-4.2.0/ux/'); Ext.require([ 'Ext.grid.*', 'Ext.data.*', 'Ext.ux.grid.FiltersFeature', 'Ext.toolbar.Paging', 'Ext.ux.ajax.JsonSimlet', 'Ext.ux.ajax.SimManager' ]); </script>
2.gridd的配置
grid = Ext.create('Ext.grid.Panel', { renderTo : "testDiv", id : 'DynamicGrid', store : jsonStore, plugins : 'bufferedrenderer', columnLines : true, title : "testGrid", selModel : sm, columns : [{ text : '名称', cls : 'x-column-header-align-default', width : 150, menuDisabled : false, dataIndex: 'name', filter : { type : 'string' //筛选类型 } },{ text : '金额', cls : 'x-column-header-align-default', width : 150, align: 'right', hideable: false, menuDisabled : false, dataIndex: 'MONEY' },{ text : '时间', cls : 'x-column-header-align-default', width : 120, menuDisabled : false, dataIndex: 'TIME' }], height : 600, width : 500, enableLocking : false, enableColumnMove : true, enableColumnResize: true, rowNumberer : 0, features: [{//筛选配置 ftype: 'filters', encode: true, local: false, filters: [ { type: 'numeric', dataIndex: 'MONEY' //也可在这里定义筛选类型 }, { type: 'date', dataIndex: 'TIME' } ], buildQuery: function(filters) {//筛选调用的方法 var reStr = {}; var str = ''; for(var i=0, len=filters.length; i<len; i++) { //f.data.value 筛选的值 //f.data.type 筛选类型 str=str+filterBuildSql(filters[i], '', ''); } reStr['reQuery'] = str;//设置传递后台的值 return reStr; } }], viewConfig : { autoScrool: true, trackOver: false, forceFit:false } , tbar: pageBar });
3.后台获取方法
String filterValue = request.getParameter("reQuery");