extjs实现选择多表自定义查询功能————前台部分(ext源码)
来源:广州中睿信息技术有限公司官网
发布时间:2012/10/21 23:25:16 编辑:admin 阅读 396
主要使用的技术:1、extjs2.0,整体框架2、RemoteCheckboxGroup.js,用于动态生成表字段(供查询结果使用)3、Ext.ux.grid.RowActions.js,用于gri

主要使用的技术:

1、extjs2.0,整体框架

2、RemoteCheckboxGroup.js ,用于动态生成表字段(供查询结果使用)

3、Ext.ux.grid.RowActions.js,用于grid行扩展(上移下移删除等)

4、Datetime.js,用于时间选择

5、MetaGrid.js 用于动态生成查询结果列表(返回结果Grid)

6、ehcache 用于缓存自定表数据,比如表名称、字段描述、长度等固定信息

7、jxl.jar 用于查询结果输出,最后生成Excel文件

8、Java

 

EditGridPanel主要代码如下:

  1      {header:'括号',dataIndex:'leftbrackets',width:40,editor:new Ext.grid.GridEditor(new Ext.form.ComboBox({
  2                     store: new Ext.data.SimpleStore({
  3                         fields:['value','text'],
  4                         data: leftBracketsComboData
  5                     }),
  6                     mode: 'local',
  7                     triggerAction: 'all',
  8                     editable:false,
  9                     valueField: 'value',
 10                     displayField: 'text',
 11                     readOnly:true
 12 //                    lazyInit:false,
 13 //                    listeners: {
 14 //                        'focus' : 
 15 //                              function(){  
 16 //                                this.expand();  
 17 //                               }  
 18 //                      }
 19                 })),
 20                 renderer: function(value, cellmeta, record){
 21                     if(value == null || value == ""){
 22                         return "";
 23                     }
 24                     return leftBracketsComboData[value][1];
 25                 },scope:this}
 26             ,{header:'表名称',dataIndex:'tablename',width:80,editor:new Ext.grid.GridEditor(new Ext.form.ComboBox({
 27                     store: new Ext.data.SimpleStore({
 28                         fields:['value','text'],
 29                         data: baseTableData
 30                     }),
 31                     id:'baseTableNameID',
 32                     tpl: '<tpl for="."><div ext:qtip="{text}" class="x-combo-list-item">{text}</div></tpl>',
 33                     mode: 'local',
 34                     triggerAction: 'all',
 35                       editable:false,
 36                     valueField: 'value',
 37                     displayField: 'text',
 38                     lazyInit:false,
 39                     listeners: {
 40                          'expand':function(combo){
 41                                   combo.clearValue();
 42                                   combo.store.loadData(baseTableData);
 43                           }
 44                           ,'select':function(){
 45                                   
 46                           }
 47                          ,'focus' :function(){  
 48                                 this.expand();  
 49                            }  
 50                       }
 51                 })),
 52                 renderer: function(value, cellmeta, record, row, col, store){
 53                        if(value == null || value == ""){
 54                         return;
 55                     } 
 56                     return record.get("tablenamestring");
 57                 }}
 58             ,{header:'查询条件列',dataIndex:'fieldname',width:90,editor:new Ext.grid.GridEditor(new Ext.form.ComboBox({
 59                     id:'fieldnameID'
 60                       ,store : new Ext.data.Store({
 61                                 proxy : new Ext.data.HttpProxy({url : '../SearchTableColumns/extlistKV.do'})
 62                                 ,reader : new Ext.data.JsonReader({}, ['name','chinese'])
 63                                 ,baseParams:{s_tablename:'0'}
 64                                 })   
 65                             ,tpl: '<tpl for="."><div ext:qtip="{chinese}" class="x-combo-list-item">{chinese}</div></tpl>'
 66                             ,valueField :'name'
 67                             ,displayField :'chinese'
 68                             ,mode : 'remote'
 69                             ,forceSelection : true
 70                             ,triggerAction : 'all'
 71                             ,typeAhead : false
 72                             ,selectOnFocus : true
 73                             ,resizable:true
 74                             ,width : 120
 75                             ,lazyInit:false
 76                             ,listeners: {
 77                                   'focus' : 
 78                                       function(){  
 79                                         this.expand();  
 80                                        }
 81                               }
 82                     }
 83                 )),
 84                 renderer: function(value, cellmeta, record, row, col, store){
 85                     if(value == null || value == ""){
 86                         return "";
 87                     }
 88                     return record.get("fieldnamestring");
 89                 }}
 90             ,{header:'逻辑运算符',dataIndex:'relationsign',width:70,editor:new Ext.grid.GridEditor(new Ext.form.ComboBox({
 91                     store: new Ext.data.SimpleStore({
 92                         fields:['value','text'],
 93                         data: relationSignComboData
 94                     }),
 95                     mode: 'local',
 96                     triggerAction: 'all',
 97                     editable:false,
 98                     valueField: 'value',
 99                     displayField: 'text',
100                     readOnly:true,
101                     lazyInit:false,
102                     listeners: {
103                          'focus' : 
104                               function(){  
105                                 this.expand();  
106                                }  
107                       }
108                 })),
109                 renderer: function(value, cellmeta, record, row, col, store){
110                     if(value == null || value == ""){
111                         return;
112                     }
113                     return relationSignComboData[value][1];
114                 },scope:this}
115             ,{header:'查询条件值',dataIndex:'expressvalue',width:125,editor:new Ext.grid.GridEditor(new Ext.form.TextField({       }))
116                , renderer: function(value, cellmeta, record, row, col, store){
117                     if(value == null || value == ""){
118                         return "";
119                     }
120                     return record.get("expressvaluestring");
121                 }
122                 }
123                 ,{header:'括号',dataIndex:'rightbrackets',width:40,editor:new Ext.grid.GridEditor(new Ext.form.ComboBox({
124                     store: new Ext.data.SimpleStore({
125                         fields:['value','text'],
126                         data: rightBracketsComboData
127                     }),
128                     mode: 'local',
129           &
联系我们CONTACT 扫一扫
愿景:成为最专业的软件研发服务领航者
中睿信息技术有限公司 广州•深圳 Tel:020-38931912 务实 Pragmatic
广州:广州市天河区翰景路1号金星大厦18层中睿信息 Fax:020-38931912 专业 Professional
深圳:深圳市福田区车公庙有色金属大厦509~510 Tel:0755-25855012 诚信 Integrity
所有权声明:PMI, PMP, Project Management Professional, PMI-ACP, PMI-PBA和PMBOK是项目管理协会(Project Management Institute, Inc.)的注册标志。
版权所有:广州中睿信息技术有限公司 粤ICP备13082838号-2