`
ts1993
  • 浏览: 13822 次
  • 性别: Icon_minigender_2
  • 来自: 南京
社区版块
存档分类
最新评论

Ext Grid 动态移除 删除 tbar 组件

 
阅读更多
 /**
 * @include "../../common/Utils.js"
 */
Ext.define('app.view.performance.Home',{
	extend:'Ext.window.Window',
	alias:'widget.pfhome',
	title:'XXXXXX',
	modal : true,
    constrain:true,
    resizable:false,
    iconCls: 'jixiaoguanli',
	initComponent:function(){
		var me = this;
		var performanceds = Ext.create('app.store.PerFormances');
		var pfrecordds = Ext.create('app.store.PfRecords');
		Ext.applyIf(me,{
			width:1000,
			height:550,
			layout:'border',
			items:[{
				xtype:'treepanel',
				region:'west',
				store:Ext.create("Ext.data.TreeStore",{
						proxy:{
							url:'filtertrees/tree',
							extraParams:{menuId:'-20'},
							type:'ajax',
							reader:{
								type:'json',
								root:'items'
							}
						},
						root:{
							id:'tree-root',
							text:'根节点',
							expanded:true
						},
						autoLoad:true,
                        listeners:{
                            beforeload:function(store,opt){
                              var node = opt.node;
                              if(node.raw){
                                opt.params.type = node.raw.type; 
                                opt.params.id = node.raw.id;
                              }
                            }
                        }
					}),
				listeners:{
					itemdblclick:function(tp,record,item,index,evt,opt){
						var raw = record.raw;
						var grid = me.down('performancelist');
						if(raw.leaf){//叶子节点
								if(raw.type == "doubledate"){
									//show dateselector
								}else{
                                     if(raw.type=='month'){
                                    	Ext.create('app.view.base.MonthSelector',{
                                    		listeners:{
                                    			okhandler:function(str){
													var params = {};
													var vals = record.parentNode.raw||record.raw;
													if(vals.cnd=='='){
			                          					params[vals.fieldName]=str;
													}else if(vals.cnd=='cnd'){
														params['sql']=str;
													}else{
														params['sql']=app.Utils.getSqlBySelect(vals.cnd,vals.fieldName,str);
													}
													var proxy = grid.getStore().getProxy();
													var _url  = proxy.url;
													grid.getStore().setProxy({
														extraParams:params,
														url:_url,
														type:proxy.type,
														reader:proxy.reader
													});
													grid.getStore().load();
			                                    }
                                    		}
                                    	}).show();
                                    }else{
										var params = {};
										var vals = record.parentNode.raw||record.raw;
										if(vals.cnd=='='){
                          					params[vals.fieldName]=raw.value;
										}else if(vals.cnd=='cnd'){
											params['sql']=raw.value;
										}else{
											params['sql']=app.Utils.getSqlBySelect(vals.cnd,vals.fieldName,raw.value);
										}
										var proxy = grid.getStore().getProxy();
										var _url  = proxy.url;
										grid.getStore().setProxy({
											extraParams:params,
											url:_url,
											type:proxy.type,
											reader:proxy.reader
										});
										grid.getStore().load();
                                    }
								}
							}
					}
				},
				resizable:true,
				width:200
			},{
				xtype:'container',
				region:'center',
				layout:'anchor',
				defaults:{
					anchor:'100%'
				},
				items:[{
					xtype:'performancelist',
					height:250,
					store:performanceds,
					tbar:null,
					listeners:{
						afterrender:function(g){
							g.getStore().load({
								params:{empid:me['empid']}
							});
							return false;
						},
						itemdblclick:function(view,rec){
							pfrecordds.load({
								params:{
									empid:rec.get('empid'),
									sql:(" DATE_FORMAT(`times`,'%Y-%m') = '"+Ext.Date.format(Ext.Date.parse(rec.get('date'),
									app.Utils.DATE_FORMAT),'Y-m')+"'")
								}
							});
							return false;
						}
					}
				},{
					xtype:'pfrecordlist',
					height:267,
					store:pfrecordds,
					tbar:[{
						iconCls: 'add',
						text:'新增',
						_sname:'add',
						handler:function(btn){
							me.fireEvent('addhandler',me,btn);
						}
					},'-',{
						iconCls: 'drop',
						text:'删除',
						_sname:'remove',
						handler:function(btn){
							me.fireEvent('removehandler',me,btn);
						}
					},'-',{
						iconCls: 'tuichu',
						text:'退出',
						handler:function(btn){
							me.close();
						}
					}]
				}]
			}]
		});
		me.callParent(arguments);
	}
});




 var view2 = Ext.create('app.view.performance.Home',{
					                		empid:record.get("empid")
					                	});
					                	view2.down("[xtype=container]").down("[xtype=pfrecordlist]").down("[_sname=add]").ownerCt.destroy();
										view2.show();
分享到:
评论

相关推荐

    extgrid属性[文].pdf

    在软件开发中,特别是在构建用户界面时,ExtJS是一个常用且强大的JavaScript库,它提供了丰富的组件,例如Ext.grid,用于创建交互式的表格视图。在处理Ext.grid时,理解其属性、方法和事件是至关重要的。以下是对...

    ext 列表页面关于多行查询的办法

    首先在Ext.grid.GridPanel中必须要有tbar对象 然后要增加listeners: { ‘render’: function() { bbar2.render(this.tbar); //add one tbar //twoTbar.render(this.tbar); //add two tbar // threeTbar.render(this....

    Ext常用属性总结

    13. **tbar** 和 **bbar** - 分别用于设置组件顶部和底部的工具栏。 14. **store** - 关联数据存储,常用于Grid Panel等组件显示数据。 15. **columns** - Grid Panel的列定义,包括字段名、宽度、对齐方式等。 ...

    ExtJs grid多选时获取选中的所有值

    其中,Grid Panel(简称 Grid)是ExtJs中最常用的一个组件之一,用于展示表格数据。在实际业务场景中,经常需要支持用户对表格中的多行数据进行选择,并执行批量操作,如删除、编辑等。因此,掌握如何在ExtJs Grid中...

    Ext_Js分页显示案例详解

    在Ext_Js中,主要依赖于`Ext.data.Store`对象来管理数据,以及`Ext.grid.Panel`或`Ext.dataview.DataView`等控件来展示这些数据。分页可以通过`Ext.PagingToolbar`组件实现。 1. **Store对象**:Store是Ext_Js中用...

    Ext 实现自定义控件

    在这里,我们创建了一个名为 `myArticleList` 的新组件,它继承自 `Ext.grid.GridPanel`。在 `initComponent` 中,我们创建了一个新的 `JsonStore` 用于存储数据,并设置了其字段和数据源URL。注意,重载 `...

    Ext表格控件和树控件

    var grid = new Ext.grid.GridPanel({ renderTo: "hello", title: "NetJava表格测试", height: 150, width: 600, columns: [ { header: "项目名称", dataIndex: "name" }, { header: "开发团队", dataIndex:...

    Ext.DataView 图片列表显示

    //得到后台的数据 var proxy = new Ext.data.HttpProxy({ url:showUrl, timeout:3600000 }); //分页参数 findParams ={start:0,limit:limit};... tbar : myTbar, renderTo: 'imageList' });

    Extjs Grid 操作大全

    它提供了一组丰富的UI组件,包括Grid组件,使得开发者能够轻松地创建出功能强大的数据展示表格。 #### 二、获取Grid中的各种值 在Extjs Grid中,通常会涉及到对Grid中数据的读取操作。例如,获取特定行或列的数据...

    Ext面向对象开发实践代码第1/2页

    首先,`PersonListGridPanel` 类是基于 `Ext.grid.GridPanel` 扩展的,它添加了两个窗口实例变量 `insertWin` 和 `updateWin`,分别用于处理新增和编辑数据的操作。`constructor` 方法中,这两个窗口实例被创建并...

    ext js 培训资料

    在本次的“Ext JS 培训资料”中,我们将深入探讨其中的核心组件——Panel(面板),它在Ext JS开发中扮演着至关重要的角色。 Panel是Ext JS中最常用的控件之一,它是一种容器,可以用来展示特定的HTML信息,并且...

    ToolbarKeyMap.js tbar或按钮绑定的快捷键

    可绑定tbar ,按钮简单方便new Ext.ux.ToolbarKeyMap() keyBinding : { key :key, ctrl:true }即可

    Ext + dwr 实现分页功能

    tbar: new Ext.PagingToolbar({ pageSize: 20, store: store, displayInfo: true }), renderTo: 'example-grid', width: 600, height: 400 }); store.load({params: {start: 0, limit: 20}}); }); ``` #...

    搜集来的ext布局材料

    布局决定了组件如何在容器中排列和显示。以下是从给定代码片段中提取的EXT布局相关的重要知识点: 1. **Viewport布局**: - `Ext.Viewport` 是EXTJS中的一个全局对象,用于全屏布局,它会占据浏览器的整个视口。 ...

    extjs两个tbar问题探讨

    在讨论ExtJS框架时,我们经常涉及到面板(panel)的设计和配置,其中tbar(top bar,顶部工具栏)是一个重要的UI组件,它位于面板的顶部,用于放置各种控件,比如按钮、搜索框、下拉列表等。而在ExtJS中,bbar...

Global site tag (gtag.js) - Google Analytics