Ext中数据在grid之间移动换行
来源：互联网 发布：网络女主播自我介绍 编辑：程序博客网 时间：2024/06/05 00:15
1，要实现选中行在grid之间移动换行；
2，我的思路是把里面的数据拿出来之后，调整到位置，然后在显示出来；
3，效果如图；
4，代码如下
dataButtonWin:function(){ var leftgriddata=[]; leftgriddata=[ {name: 'Rec 0', column1: '0', column2: '0'}, {name: 'Rec 1', column1: '1', column2: '1'}, {name: 'Rec 2', column1: '2', column2: '2'}, {name: 'Rec 3', column1: '3', column2: '3'}, {name: 'Rec 4', column1: '4', column2: '4'}, {name: 'Rec 5', column1: '5', column2: '5'}, {name: 'Rec 6', column1: '6', column2: '6'}, {name: 'Rec 7', column1: '7', column2: '7'}, {name: 'Rec 8', column1: '8', column2: '8'}, {name: 'Rec 9', column1: '9', column2: '9'} ]; Ext.create('Ext.window.Window',{ width:800, height:600, viewModel: { data: { str: '' } }, layout: { type: 'hbox', align: 'stretch' }, items: [ Ext.create('Ext.grid.Panel',{ xtype: 'grid', title: 'First Grid', //reference: 'grid1', flex: 1, multiSelect: true, margin: '0 5 0 0', tools: [{ type: 'refresh', tooltip: 'Reset both grids', handler: 'onResetClick' }], viewConfig: { listeners: { selectionchange: function(record){ //var sels=this.getSelectionModel().getSelection()[0]; //var obj; //var data=(this.myData=[]); //data.push(obj = Ext.apply({}, sels.data)); //delete obj.id; //this.ownerCt.ownerCt.items.items[2].getStore().loadData(this.myData); } } }, store: { data: leftgriddata }, columns: [{ text: 'Record Name', dataIndex: 'name', flex: 1, sortable: true }, { text: 'column1', dataIndex: 'column1', width: 80, sortable: true }, { text: 'column2', dataIndex: 'column2', width: 80, sortable: true }] }), { xtype:'container', layout:{ type:'table', columns:3 }, defaults:{ xtype:'container', width:50, height:50 }, items:[ { colspan:3, height:100 }, { }, { xtype:'button', iconCls:'x-fa fa-arrow-circle-o-up', handler:function(record){ var leftgrid=record.ownerCt.previousSibling(); var rightgrid=record.ownerCt.nextSibling(); var rightarr=[]; rightarr=rightgrid.getStore().data.items; var rightarrdata=[]; for(var i=0;i<rightarr.length;i++){ rightarrdata.push(rightarr[i].data) } var sels=rightgrid.getSelectionModel().getSelection()[0]; var changerowarr=[]; for(var k=1;k<rightarrdata.length;k++){ if(rightarrdata[k].column1==sels.data.column1){ changerowarr=rightarrdata[k]; rightarrdata[k]=rightarrdata[k-1]; rightarrdata[k-1]=changerowarr; break; } } //var data=[ // {name: 'Rec 0', column1: '0', column2: '0'}, // {name: 'Rec 1', column1: '1', column2: '1'}, // {name: 'Rec 2', column1: '2', column2: '2'}, // {name: 'Rec 3', column1: '3', column2: '3'}, // {name: 'Rec 5', column1: '5', column2: '5'}, // {name: 'Rec 4', column1: '4', column2: '4'}, // {name: 'Rec 6', column1: '6', column2: '6'}, // {name: 'Rec 7', column1: '7', column2: '7'}, // {name: 'Rec 8', column1: '8', column2: '8'}, // {name: 'Rec 9', column1: '9', column2: '9'} // ]; //var obj; //var data=(this.ownerCt.myData=[]); //data.push(obj = Ext.apply({}, sels.data)); //delete obj.id; rightgrid.getStore().loadData(rightarrdata); //rightgrid.getStore().remove(sels); //leftgrid.getStore().insert(0, data); } }, {}, { xtype:'button', iconCls:'x-fa fa-arrow-circle-left', handler:function(record){ var leftgrid=record.ownerCt.previousSibling(); var rightgrid=record.ownerCt.nextSibling(); var sels=rightgrid.getSelectionModel().getSelection()[0]; var obj; var data=(this.ownerCt.myData=[]); data.push(obj = Ext.apply({}, sels.data)); delete obj.id; //rightgrid.getStore().loadData(data); rightgrid.getStore().remove(sels); leftgrid.getStore().insert(0, data); } }, {}, { xtype:'button', iconCls:'x-fa fa-arrow-circle-right', handler:function(record){ var leftgrid=record.ownerCt.previousSibling(); var rightgrid=record.ownerCt.nextSibling(); var sels=leftgrid.getSelectionModel().getSelection()[0]; var obj; var data=(this.ownerCt.myData=[]); data.push(obj = Ext.apply({}, sels.data)); delete obj.id; leftgrid.getStore().remove(sels); //rightgrid.getStore().loadData(data); rightgrid.getStore().insert(0, data); } }, {}, { xtype:'button', iconCls:'x-fa fa-arrow-circle-o-down', handler:function(record){ var leftgrid=record.ownerCt.previousSibling(); var rightgrid=record.ownerCt.nextSibling(); var rightarr=[]; rightarr=rightgrid.getStore().data.items; var rightarrdata=[]; for(var i=0;i<rightarr.length;i++){ rightarrdata.push(rightarr[i].data) } var sels=rightgrid.getSelectionModel().getSelection()[0]; var changerowarr=[]; for(var k=0;k<rightarrdata.length-1;k++){ if(rightarrdata[k].column1==sels.data.column1){ console.log(k); changerowarr=rightarrdata[k]; rightarrdata[k]=rightarrdata[k+1]; rightarrdata[k+1]=changerowarr; break; } } //var data=[ // {name: 'Rec 0', column1: '0', column2: '0'}, // {name: 'Rec 1', column1: '1', column2: '1'}, // {name: 'Rec 2', column1: '2', column2: '2'}, // {name: 'Rec 3', column1: '3', column2: '3'}, // {name: 'Rec 5', column1: '5', column2: '5'}, // {name: 'Rec 4', column1: '4', column2: '4'}, // {name: 'Rec 6', column1: '6', column2: '6'}, // {name: 'Rec 7', column1: '7', column2: '7'}, // {name: 'Rec 8', column1: '8', column2: '8'}, // {name: 'Rec 9', column1: '9', column2: '9'} // ]; //var obj; //var data=(this.ownerCt.myData=[]); //data.push(obj = Ext.apply({}, sels.data)); //delete obj.id; rightgrid.getStore().loadData(rightarrdata); //rightgrid.getStore().remove(sels); //leftgrid.getStore().insert(0, data); } }, {} ] }, { xtype: 'grid', title: 'Second Grid', reference: 'grid2', flex: 1, stripeRows: true, store: { }, columns: [{ text: 'Record Name', dataIndex: 'name', flex: 1, sortable: true }, { text: 'column1', dataIndex: 'column1', width: 80, sortable: true }, { text: 'column2', dataIndex: 'column2', width: 80, sortable: true }] }] }).show();},
阅读全文
0 0
- Ext中数据在grid之间移动换行
- ext grid 换行
- 实现Ext的grid单元格数据过长换行显示
- Ext中combobox在grid显示问题
- Ext中combobox在grid显示问题
- Extjs4.1向Ext.grid.Panel创建的gridpanel中动态在第一行插入数据
- Ext本地数据在Grid中分页显示，隐藏指定字段
- grid中实现换行
- EXT 中数据行的移动
- Ext.Net中Grid控件内容显示过多，自动换行处理方式
- Ext中combobox在Grid里显示问题
- EXT中关于得到grid分页数据以及EXT导出你所要数据
- EXT数据展示（Ext.grid.Panel）
- EXT EditorGridPanel 中使用Ext.grid.CheckColumn
- Ext 中Ext.grid.GridPanel样式设置
- 在Grid和Form之间进行数据交互
- 转载：grid中实现换行
- Ext中Grid添加ToolTip
- 产品经理是否需要做运营？
- JVM-运行时数据区(Run-time Data Areas)
- 频道
- pycharm中如何将ui文件转化为py文件，以及Pycharm和QtDesigner的集合
- Nginx的虚拟主机的配置
- Ext中数据在grid之间移动换行
- securt 快速搜索日志及上传下载
- 对软狗价格及软狗开发思路的调研
- flex弹性盒子布局基础
- javascript 获取当前时间
- 代码面试指南学习记录-第一章01
- 混淆分享，里面包含了示例代码和 markdown 文件
- Struts的附加功能
- 修改discuz门户生成html的目录结构
