前臺：

Store:

var resource = new Ext.data.Store({
      fields: ['imgpath','typeImage','title', 'type'],
      url: 'teaching/resource/resourceAction.evi?method=getResourceList',
      reader: new Ext.data.XmlReader(
        {
          record: "Item",
          totalRecords: "TotalCount"
        },
      [{name:'title',mapping: 'title'}, {name:'type',mapping: 'type'},{name:'imgpath',mapping: 'imgpath'},{name:'typeImage',mapping: 'typeImage'} ]
    )
});

resource.addListener('load', function(st, rds, opts) {
        // st 是當前的store, rds是讀到的Record[], opts是store的配置
   for( var c=0; c<rds.length; c++ ) {
       rds[c].set('typeImage', "<img src='./images/33.gif' width='12' height='12' />");
       //待定類別，先定死類別圖片
      }
});

resource.load({params:{start:0,limit:10}});

var resourceType = new Ext.data.Store({
,
      reader: new Ext.data.XmlReader({
      record: "Item"
     }, [
      {name: 'resourceTypeId', mapping: 'resourceTypeId'},
       {name: 'resourceType', mapping: 'resourceType'}
      ])
   });
resourceType.load();
var languageType = new Ext.data.Store({
,
      reader: new Ext.data.XmlReader({
      record: "Item"
     }, [
       {name: 'languageTypeId', mapping: 'languageTypeId'},
       {name: 'languageType', mapping: 'languageType'}
      ])
   });
languageType.load();

列表：

resourcePanel = new Ext.grid.GridPanel({
id: 'resources',
frame: true,
header: false,
width: 288,
autoWidth: true,
autoHeight: true,
loadMask:{msg:'正在加載數據，請稍侯……'},
iconCls:'icon-grid',
viewConfig: { forceFit: true },
   columns:[
  {header: " ",dataIndex: 'typeImage' , width:20},
  {header: "資源標題", width: 190, sortable: true, dataIndex: 'title'},
  {header: "類別", width: 80, sortable: true, dataIndex: 'type'}
   ],
  store: resource,
  selModel: new Ext.grid.RowSelectionModel({singleSelect:false}),
     bbar: new Ext.PagingToolbar({
  pageSize: 10,
  store: resource,
  displayInfo: false,
  //displayMsg: '顯示第 {0} 條到 {1} 條記錄，一共 {2} 條',
  emptyMsg: "沒有記錄" 
      }),
  listeners: {
  rowclick:function(e) {
   try {
    window.parent.parent.Ext.ux.MyTips.msg("提示", "雙擊該行可預覽該資源");
    } catch(e) {}
    },
  rowdblclick:function(g, rIdx, e) {
   var rd = g.getStore().getAt(rIdx);
   var html = "<img src='./images/" + rd.get('imgpath') + "' />";
  window.parent.showWin({
      layout: 'fit',
      maximizable: true,
      title: rd.get('title'),
      width: 400,
      height: 400,
      //modal: true,
      //closeAction: 'hide',
      plain: true,
      items: [ {html: html} ]
    });
  }
}
});

FormPanel:

var rform = new Ext.form.FormPanel({
              id:'rform',
           header: false,
           frame: true,
           hideBorders: false,
           items: [
            new Ext.form.TextField({
             fieldLabel: '關鍵字',
             name:'keyword'
            }),
            new Ext.form.ComboBox({
             fieldLabel: '資源類別',
             mode: 'local',
             triggerAction: 'all',
             store: resourceType,
             typeAhead: true,
             hiddenName:'resourceTypeId',
             displayField: 'resourceType',
             valueField: 'resourceTypeId',
             readOnly: true,
             selectOnFocus: true
            }),
            new Ext.form.ComboBox({
             fieldLabel: '語言',
             mode: 'local',
             triggerAction: 'all',
             typeAhead: true,
             hiddenName:'languageTypeId',
             displayField:'languageType',
             valueField:'languageTypeId',
             readOnly: true,
             selectOnFocus: true,
             store:languageType
            }),
            new Ext.Panel({
             layout: 'table',
             buttonAlign: 'center',
             layoutConfig: { colspan: 3 },
             buttons:[{text: '搜  尋',
              handler: function() {
                             var keyword = Ext.get('keyword').dom.value;
                             var resourceTypeId = Ext.get('resourceTypeId').dom.value;
                             var languageTypeId = Ext.get('languageTypeId').dom.value;
                      resource.reload({params:{start:0,limit:3,keyword:keyword,resourceTypeId:resourceTypeId,languageTypeId:languageTypeId}});
   //這里不用再寫ajax，Ext已經封裝了ajax，只要把參數傳進去就行了  
              }},
              {
                text: '重  置',
                handler: function() {
                   Ext.getCmp('rform').form.reset();
               }
               }
              ]
            })
           ]
          })

后臺：

public ActionForward getResourceList(ActionMapping mapping,
   ActionForm form, HttpServletRequest request,
   HttpServletResponse response) throws IOException {

  Document document = DocumentHelper.createDocument();
  String start = request.getParameter("start");
  String limit = request.getParameter("limit");
  String keyword = request.getParameter("keyword");
  String resourceTypeId = request.getParameter("resourceTypeId");
  String languageTypeId = request.getParameter("languageTypeId");

  List<HqlCondition> hqlFilter = new LinkedList<HqlCondition>();
  if(keyword != null && keyword.length()>0){
   hqlFilter.add( new HqlCondition("and", "rs.title", "like", "%" + keyword + "%", HqlCondition.String) );
   hqlFilter.add( new HqlCondition("or", "rs.remarks", "like", "%" + keyword + "%", HqlCondition.String) );
  }
  if(resourceTypeId != null && resourceTypeId.length()>0){
   hqlFilter.add( new HqlCondition("and", "rs.resourceType.resourceTypeId", "=", new Long(resourceTypeId), HqlCondition.Long) );
  }
  if(languageTypeId != null && languageTypeId.length()>0){
   hqlFilter.add( new HqlCondition("and", "rs.languageType.languageTypeId", "=", new Integer(languageTypeId), HqlCondition.Integer) );
  }
  int pageno =1;
  int pagesize = 10;
  if(limit != null && limit.length()>0){
      pagesize = Integer.parseInt(limit);
  }

  if(!start.equalsIgnoreCase("0") && start != null && start.length()>0){
     int bpos = Integer.parseInt(start);
     pageno = (bpos + pagesize)/pagesize;
  }
  int total = this.rse.getResourceTotalCount(hqlFilter);
  Collection<BaseVO> coll = this.rse.getResourceList(hqlFilter,pageno,pagesize);
  Iterator<BaseVO> it = coll.iterator();
  while(it != null && it.hasNext()){
   BaseVO bv = it.next();
   ResourceType rt = this.rts.getResourceType(((ResourceType)bv.get("resourceType")).getResourceTypeId());
   bv.set("type", rt.getResourceType());
  }
  document.addElement("type");
  new OutputVOXml().writeXML(total,new LinkedList<BaseVO>(coll), response);
  return null;
}