Extjs4实现两个GridPanel之间数据拖拽功能具体方法
更新时间：2013年11月21日 14:45:35 作者：
这篇文章主要介绍了Extjs4实现两个GridPanel之间数据拖拽功能具体方法，有需要的朋友可以参考一下
1、之前在winForm上有看过在选择数据时会将一些数据放在待选框中，而用户可以将想要选择的数据放到备选框中，那么如何用Extjs实现类似功能，我们选择用两个gridPanel来模拟其中的备选框和待选框。如下图所示：
定义代码如下：
复制代码 代码如下:
{
xtype:'gridpanel',
multiSelect: true,
id:'staff',
x: 5,
y: 0,
height: 205,
width: 260,
viewConfig: {
plugins: {
ptype: 'gridviewdragdrop',
dragGroup: 'firstGridDDGroup',
dropGroup: 'secondGridDDGroup'
},
listeners: {
drop: function(node, data, dropRec, dropPosition) {
var dropOn = dropRec ? ' ' + dropPosition + ' ' + dropRec.get('name') : ' on empty view';
}
}
},
store:StaffData, //加载数据的store
columns: columns,
stripeRows: true,
title: '从业人员',
margins: '0 2 0 0'
},
{
xtype:'gridpanel',
id:'admin',
x: 280,
y: 0,
height: 205,
width: 260,
viewConfig: {
plugins: {
ptype: 'gridviewdragdrop',
dragGroup: 'secondGridDDGroup',
dropGroup: 'firstGridDDGroup'
},
listeners: {
drop: function(node, data, dropRec, dropPosition) {
var dropOn = dropRec ? ' ' + dropPosition + ' ' + dropRec.get('name') : ' on empty view';
}
}
},
store:AdminData,
columns:columns,
stripeRows:true,
title:'管理员',
margins:'0 0 0 3'
}
这样我们在拖拽时即可以将数据存储在所对应的store中，需要的时候从store取出数据即可。
相关文章
这篇文章主要介绍了JavaScript ES2019中的8个新特性详解，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2019-02-02
在网上看到很多人都写了“webpack最佳实践方案”，适合的才是“最佳”的，在这里总结一下自己在工作过程中总结出来的最佳实践，所以本文主要介绍了关于webpack配置的相关资料，需要的朋友们可以参考借鉴，下面来一起看看吧。2017-04-04
本文给大家总结了js动态设置css样式的常见方法，非常实用，对js设置css样式相关知识感兴趣的朋友一起学习吧2016-11-11
JS控制非法字符的输入实现代码，需要的朋友可以参考下。2009-12-12
这篇文章主要帮助大家理解javascript中Map代替循环，感兴趣的小伙伴们可以参考一下2016-02-02
闭包是ECMAScript一个很重要的特征，但是却很难用合适的定义来描述它。虽然闭包很难清晰地描述，但是，却很容易创建，或者说，不小心创建。然而，闭包的存在其实是有一定的潜在问题的。为了避免“不小心”地创建闭包，以及更好地利用闭包的优点，有必要理解闭包的机制2013-11-11
项目中需要FusionCharts图表显示双Y轴，好像FCF_MSLine.swf不可以这样，只能显示一个Y轴，多条线,找了一下，用MSCombiDY2D.swf可以实现,现在晒出来和大家分享一下2012-11-11
window.location的重写及判断location是否被重写
这篇文章主要介绍了window.location的重写及判断location是否被重写,需要的朋友可以参考下2014-09-09
这篇文章主要介绍了JavaScript设计模式之享元模式,结合实例形式较为详细的分析了javascript享元模式相关概念、原理、用法及操作注意事项,需要的朋友可以参考下2019-01-01
这篇文章主要介绍了JS回调函数原理与用法,结合实例形式详细分析了JavaScript回调函数的概念、原理、用法,并给出了PHP回调函数的使用示例,需要的朋友可以参考下2019-07-07
最新评论