此代码适用于 Extjs 4.0.2a 但当转换为4.1时它不再工作并给出错误
未捕获类型错误:无法调用未定义的方法“query”
Ext.onReady(function() {
var panel = new Ext.Panel({
renderTo: divtag,
draggable: {
insertProxy: false,
onDrag: function(e) {
var el = this.proxy.getEl();
this.x = el.getLeft(true);
this.y = el.getTop(true);
},
endDrag: function(e) {
this.panel.setPosition(this.x, this.y);
}
},
title: 'Panel',
width: 200,
height: 100,
x: 20,
y: 20
});
});
最佳答案
这个版本的 Ext 显然有一个错误。即使您尝试使用默认的 D'n'D 面板,它也不会工作,如下所示:
Ext.onReady(function() {
var panel = new Ext.Panel({
renderTo: 'divtag',
draggable: true,
title: 'Panel',
width: 200,
height:100,
x: 20,
y: 20
}); //panel.show(); });
});
我设法修补代码以按照您想要的方式工作,此代码应该可以工作:
Ext.onReady(function() {
var panel = new Ext.Panel({
renderTo: 'divtag',
draggable: {
insertProxy: false,
onDrag: function(e) {
var el = this.proxy.getEl();
this.x = el.getX();
this.y = el.getY();
},
endDrag: function(e) {
panel.setPosition(this.x,this.y);
},
alignElWithMouse: function() {
panel.dd.superclass.superclass.alignElWithMouse.apply(panel.dd, arguments);
this.proxy.sync();
}
},
title: 'Panel',
width: 200,
height:100,
x: 20,
y: 20
}); //panel.show(); });
});
作为旁注,我可能建议您无论如何都不要这样做,因为您可以为可以使用的面板定义自己的 DD,甚至更好的 Ext 已经定义了一个,因此您可以覆盖 Ext 面板来使用默认Ext.util.ComponentDragger ,或者在代码中,我建议您这样做:
Ext.override(Ext.panel.Panel, {
initDraggable: function() {
var me = this,
ddConfig;
if (!me.header) {
me.updateHeader(true);
}
if (me.header) {
ddConfig = Ext.applyIf({
el: me.el,
delegate: '#' + me.header.id
}, me.draggable);
// Add extra configs if Window is specified to be constrained
if (me.constrain || me.constrainHeader) {
ddConfig.constrain = me.constrain;
ddConfig.constrainDelegate = me.constrainHeader;
ddConfig.constrainTo = me.constrainTo || me.container;
}
me.dd = Ext.create('Ext.util.ComponentDragger', this, ddConfig);
me.relayEvents(me.dd, ['dragstart', 'drag', 'dragend']);
}
}
});
var panel = Ext.create('Ext.panel.Panel', {
id: 'test',
renderTo: 'divtag',
draggable: true,
floating: true,
title: 'Panel',
width: 200,
height:100,
x: 20,
y: 20
});
面板覆盖中 initDraggable
函数的代码取自 Ext.window.Window.initDraggable 的当前稳定版本。方法。
关于javascript - 面板拖放在 extjs 4.1 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8558564/