文档章节

extjs4.1 grid 分组 (对象是一个object)以及其它。

吕兵阳
 吕兵阳
发布于 2015/03/16 10:36
字数 911
阅读 26
收藏 0

前几天做分组,老是遇到问题,后来经过测试,找到了解决方法。


model中:

Ext.define('Sharera.model.community.Topic', {
    extend: 'Ext.data.Model',
    idProperty: 'id',
    fields: [
		        {name:'id',type:'long'},
			{name:'title',type:'string'},
		        {name:'community.name',type:'string'},
         {name:'community.id',type:'long'},
		        {name:'community',type:'object'},
			{name:'creator',type:'object'},
			{name:'participator',type:'object'},
			{name:'created',type:'string'},
			{name:'modified',type:'string'},
			{name:'enabled',type:'boolean'}
    ]
});

store:

/**
 * The com.sharera.web.Topic store definition
 */
Ext.define('Sharera.store.community.Topic', {
    extend: 'Ext.data.Store',
    autoLoad: false,
    autoSync: false,
    fields: ['id','title','community','creator','participator','created','modified','enabled'],
    baseUrl : context+'api/topic',
    sorters: {property: 'created', direction: 'DESC'},
    groupField: 'community.name',  
    proxy: {
        type: 'rest',
        url: context+'api/topic',
        model: 'Sharera.model.community.Topic',
		reader : {
			type : 'json'
		},
		writer : {
			type : 'json'
		},
		listeners : {
			exception : function(proxy, response, operation) {
				if (operation) {
					Ext.Sharera.error("错误",operation.error.statusText);					
				} else {
					// May be a proxy error...
				}
			},
			load:function(store,records,successFull,o){
        		store.sort([{property : 'community',direction: 'ASC'}]);
        }
		}
    },
    setUrlforForm : function(id) {
    	if(id==undefined || id==null)
    		this.proxy.url = this.baseUrl;
    	else
    		this.proxy.url = this.baseUrl + "/" + id + ".json";
	},
	setUrlforQuery : function(name) {
		if (name == null)
			name = 'list';
		this.proxy.url = this.baseUrl + "/" + name + ".json";
	},
	setUrlforQuery4Ext : function(name) {
		if (name == null)
			name = 'listext';
		this.proxy.url = this.baseUrl + "/" + name + ".json";
	}
});


grid中的代码:



//插件添加
     features: [{
        ftype: 'groupingsummary',
        groupHeaderTpl: '<font color=blue>{[values.rows[0].data.community.name]}</font> (共:{rows.length}个话题)',
        hideGroupedHeader: true,
        enableGroupingMenu: false
     }],
header:'操作',
               align: 'center',
               xtype:'actioncolumn',               
               width:70,
               items: [{
            	   iconCls : 'icon-checkin-action',
                   tooltip: '查看',
                   handler: function(grid, rowIndex, colIndex, item) {                   	 
                      var rec = grid.getStore().getAt(rowIndex);
					  var formWin= Ext.create("Sharera.view.community.Topic.FormDisplay",{bid:rec.data.id});
				      var formObj=formWin.down('form').getForm();
				      var panel=formWin.down('panel[ref=discussion]');
 					  var fstore = Ext.create("Sharera.store.community.Topicform");                					      			      
                	  fstore.setUrlforForm(rec.data.id);
                	  fstore.load(
                			{
                        	    scope: this,
                        	    callback: function(records, operation, success) {
                        	    	formObj.loadRecord(records[0]);
                        	    	var parValue=new Array();
                        	    	var participators=records[0].data.participator;
                        	        var isUse;
                        	        if(records[0].data.enabled){
                        	        	isUse='是';
                        	        }
                        	        if(!records[0].data.enabled){
                        	            isUse='否';
                        	        
                        	        }
                        	    	for(var i=0;i<participators.length;i++){
                        	    		parValue.push(participators[i].user.fullname);
                        	    	}
                        	    	formObj.findField('community').setValue(records[0].data.community.name);
                        	    	formObj.findField('creator').setValue(records[0].data.creator.fullname);
                        	    	formObj.findField('participator').setValue(parValue.join(','));
                        	    	formObj.findField('enabled').setValue(isUse);
                        	    	
                        	    	var topicId=records[0].data.id;
                        	    	Ext.Ajax.request({
                                    	url:context+'api/discussion/topic/'+topicId+'.json',
                                    	method:'get',
                                    	success:function(response, opts){
                                             var  discussions=eval('('+response.responseText+')');
                                             var checkLength=0;
                                             panel.setTitle('讨论管理:(共有'+discussions.length+'条讨论,显示'+discussions.length+'条,已阅'+0+'条)');
                                             var containers=new Array();
                                             for(var i=0;i<discussions.length;i++){
                                             	   var id=discussions[i].id;
                                                   var container=Ext.create('Ext.panel.Panel',{
                                                         id:discussions[i].id,
                                                         cls: 'window-bord',
                                                         width:'95%',
                                                         border: 0,
                                                         padding:'20',
                                                         bodyStyle: 'padding-bottom:15px;background:#eee;',
                                                         html: '<p>  '+discussions[i].content+'</p><br>  ' +discussions[i].creator.fullname+'  '+discussions[i].created
                                                   });
                                                   container.add({
								     	      	  	       xtype:'container',
								     	      	  	       width:'100%',
								     	      	  	       padding:'5',
								     	      	  	       layout: {
														        type: 'hbox',
														        pack: 'end' , 
														        align: 'stretchmax' 
														   },
														   items:[{
														 	     xtype:'button',
														         text:'禁用',
														         ref:'forbidden',
														         check:false,
		                                                         handler: function(b) {
															         Ext.MessageBox.confirm('请确认', '您确认要禁用该讨论吗?',function(btn){
										                        		 if(btn=='yes'){
										                                    Ext.Ajax.request({
										                                    	headers: {"Content-Type": "application/x-www-form-urlencoded; charset=UTF-8"},
										                                    	url:context+'api/discussion/check/'+id+'.json',
										                                    	method:'put',
										                                    	success:function(response, opts){
										                                    		 b.hide();
										                                    		 var useButton=b.ownerCt.down('button[ref=use]');
										                                    		 useButton.show();
										                                    		 useButton.check=true;
										                                    		 if(b.check){
										                                    		     useButton.setText('禁用(已阅)');
										                                    		 }else{
										                                    		 	 checkLength++;
										                                    		 }
										                                    		 panel.setTitle('讨论管理:(共有'+discussions.length+'条讨论,显示'+discussions.length+'条,已阅'+checkLength+'条)');
										                                    	     panel.removeBodyCls()
										                                    		 panel.addBodyCls('background:#196666');
										                                    	     Ext.Sharera.msg("成功",'讨论删除成功');
										                                    	},
										                                        failure:function(response, opts){
																					Ext.Sharera.error("错误",'讨论删除失败');									
										                                        }
										                                    }); 
										                        		 }
										                             });
															     }
														   },{
														 	     xtype:'button',
														         text:'已禁用',
														         ref:'use',
														         check:false,
		                                                         iconCls : 'icon-cancel-action',
		                                                         handler: function(b) {
															         Ext.MessageBox.confirm('请确认', '您确认要启用该讨论吗?',function(btn){
										                        		 if(btn=='yes'){
										                                    Ext.Ajax.request({
										                                    	headers: {"Content-Type": "application/x-www-form-urlencoded; charset=UTF-8"},
										                                    	url:context+'api/discussion/check/'+id+'.json?type=setusable',
										                                    	method:'put',
										                                    	success:function(response, opts){
										                                    		 b.hide();
										                                    		 var fb=b.ownerCt.down('button[ref=forbidden]');
										                                    		 fb.show();
										                                    		 fb.check=true;
										                                    		 fb.setText('禁用(已阅)');
										                                    	     Ext.Sharera.msg("成功",'讨论启用成功');
										                                    	},
										                                        failure:function(response, opts){
																					Ext.Sharera.error("错误",'讨论启用失败');									
										                                        }
										                                    }); 
										                        		 }
										                             });
															     },
															     listeners:{
															         mouseover:function(view){
															               view.setIconCls('icon-tick');
															               view.setText('启用');
															         },
															         mouseout:function(view){
															         	   if(view.check){
															         	   	 view.setIconCls('icon-cancel-action');
															                 view.setText('已禁用');
															         	   }
															               
															         }
															     }
														   
														   }],
														   listeners:{
														        render: function(view){
														              var self=view;
														              var useButton=view.down('button[ref=use]');
														              useButton.hide();
														        }
														   }
														   
								     	      	  	  });
                                                   containers.push(container);
                                             }
                                             panel.add(containers);
                                    	},
                                        failure:function(response, opts){
											Ext.Sharera.error("错误",'话题禁用修改失败'+message);									
                                        }
                                    });
                        	    }
                			}
                	  );		
                   }
              },{
            	   iconCls : 'icon-cancel-action',
                   tooltip: '禁用该话题',
                   handler: function(grid, rowIndex, colIndex, item) {
                         var id=grid.getStore().getAt(rowIndex).data.id;
                   	     var store=grid.getStore();
                   	     Ext.MessageBox.confirm('请确认', '您确认要禁用该话题吗?',function(btn){
                        		 if(btn=='yes'){
                                    Ext.Ajax.request({
                                    	url:context+'api/topic/check/'+id,
                                    	method:'put',
                                    	success:function(response, opts){
                                    	     Ext.Sharera.msg("成功",'话题禁用成功');
                                    		 store.load();                               	
                                    	},
                                        failure:function(response, opts){
											Ext.Sharera.error("错误",'话题禁用修改失败'+message);									
                                        }
                                    }); 
                        		 }
                          });
                   },
                   getClass:function(v,o,r,rowIndex,colIndex,store){
	                 	if(r.data.enabled){
	                 		return 'icon-cancel-action';
	                 	}
	                 	return 'x-hidden'
                   }
              },{
            	   iconCls : 'icon-coins-action',
                   tooltip: '启用该话题',
                   handler: function(grid, rowIndex, colIndex, item) {
                         var id=grid.getStore().getAt(rowIndex).data.id;
                   	     var store=grid.getStore();
                   	     Ext.MessageBox.confirm('请确认', '您确认要启用该话题吗?',function(btn){
                        		 if(btn=='yes'){
                                    Ext.Ajax.request({
                                    	url:context+'api/topic/check/'+id+'?type=enable',
                                    	method:'put',
                                    	success:function(response, opts){
                                    	     Ext.Sharera.msg("成功",'话题启用成功');
                                    		 store.load();                               	
                                    	},
                                        failure:function(response, opts){
											Ext.Sharera.error("错误",'话题启用失败'+message);									
                                        }
                                    }); 
                        		 }
                          });
                   },
                   getClass:function(v,o,r,rowIndex,colIndex,store){
	                 	if(!r.data.enabled){
	                 		return 'icon-coins-action';
	                 	}
	                 	return 'x-hidden'
                   }
              }]








本文转载自:http://blog.csdn.net/zhengyuechuan/article/details/11657121

吕兵阳
粉丝 94
博文 276
码字总数 105376
作品 0
郑州
后端工程师
私信 提问
ExtJS4.1一个多表单共用窗口的例子

折腾了一个晚上,终于粗略实现这个功能。 1、原理很简单,就是单独创建N个表格或表单,当然还要有相应配套的store,然后每次点击菜单创建一个新对象加载到公共窗口。这里说的公共窗口其实也不...

jacksoniggyjoe
2013/05/20
0
0
Windows Phone 7 - 控件的不同类型

原文地址:http://create.msdn.com/en-US/education/quickstarts/Types_of_Controls 【译 者注:这篇文章是翻译自微软官方的WP7 QuickStart的第四篇,讲述WP下控件的不同的类型。部分内容加入...

虫虫
2012/02/21
440
0
DevExpress v15.1:WPF控件升级(一)

<下载最新版DevExpress WPF Controls v15.1.5> WPF报表设计器(CTP) WPF的报表设计器作为一个社区技术预览附带在v15.1中,下面是WPF报表设计器在此版本中可用的主要功能: 集成报表资源管理...

Miss_Hello_World
2015/08/19
0
0
Xceed WinForm数据表格控件Xceed Grid For .NET详细介绍

Xceed Grid For .NET是一款高级的,多功能的、扩展性极强的数据表格控件,具有分组、主从表、多种主题外观、固定列和行、Excel导出、支持Vista风格,交互的外观样式,内嵌报表功能,支持导出...

netkongjian
2014/06/06
0
0
DevExpress v15.1:其它控件升级

<DevExpress Universal Subscription最新版下载> Windows通用应用程序的UI控件 凭借现在投放在Windows 8 XAML平台上的代码,我们已经为微软的下一代通用应用程序平台Windows 10创建了一个集成...

Miss_Hello_World
2015/09/09
208
0

没有更多内容

加载失败,请刷新页面

加载更多

写一个线程安全的投票系统

有一个map,key存储候选人名称,value存储该候选人的得票数。请实现一个线程安全的投票系统. 为了测试并发环境下的表现,我们先设计一个小的“框架”,用来模拟并发情况下的投票行为。 首先设...

铁骨铮铮
33分钟前
1
0
今天的学习

php的类是通过关键字class来声明的,关键字后面是类名,然后是花括号,花括号里面是类的属性和方法。 类的属性和方法有四种格式,public,private,protected,finally。 意思是public(公有的...

墨冥
37分钟前
0
0
Issue和PR标签(Kubernetes社区Issue和PR标签解释)

一般标签 标签 含义 备注 good first issue 指示该issue适合由新贡献者参与 参照"help wanted"指导文档 help wanted 指示该issue需要帮助 必须满足"help wanted"指导文档 needs-kind 指示该i......

恋恋美食
今天
1
0
Array数组操作

includes() 方法用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回false。 Eg:error.message.includes('timeout'); 1、indexOfindexOf()方法返回在该数组中第一...

lslaiwy
今天
2
0
运行pipenv报错UnicodeDecodeError的问题

问题:运行pipenv就报错:UnicodeDecodeError: 'utf-8' codec can't decode ...... 环境:windows10,python 3.7.1 解决:因为升级了一次3.7.3恰好有出了这问题,结果绕了很多弯路,以为是p...

编程老陆
今天
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部