PDA

View Full Version : Ext.ux.Portal - Drag and drop of some panels is not possible



jack83
6 Dec 2012, 12:24 AM
I use in my project Ext.ux.Portal component which contains 2 columns (both of which are standard Ext js Panels). Then I add some widgets to the left or right column. The wigdets inherit directly from the Ext.grid.EditorGridPanel. The positions of the widgets in portal can be changed by drag and drop event.
Widgets can also be collapsed to save some area.

The problem I have looks as follows. When there are some more widgets in the portal, some of them, usually those from the bottom, are not draggable. Although the mouse changes its icon when moved over the widget, it is not possible to move the widget to other position at all. The dashed-line frame, normally shown during drag, is not shown and the widget does not react for drag.

http://s14.postimage.org/d1vm49wrl/Screen_Shot_2012_12_06_at_8_42_10_AM.png

I have checked that this problem is independent from the widgets and has rather to do with the size of the portal component.

Piece of code showing the cockpit definition with the drop event. The function createPositionInMatrix sends the widget new positions to save them in the DB.



cockpitPanel = new Ext.ux.Portal({
id: 'cockpit',
renderTo: 'cockpitDiv',
title: '<spring:message javaScriptEscape="true" code="cockpit.pageTitle"/>',
tools: [{
id: 'minimize',
handler: function() {
setAllCollapsed(true);
}
},{
id: 'maximize',
handler: function() {
setAllCollapsed(false);
}
},{
id: 'print',
handler: function() {
doPrint();
}
},{
id: 'gear',
handler: function() {
showSelectionPanel();
}
}],
width: '100%',
autoHeight: true,
items:[
{
columnWidth:.5,
style:'padding:6px 3px 0px 6px',
id: 'pos1'
},
{
columnWidth:.5,
style:'padding:6px 6px 0px 3px',
id: 'pos2'
}

],
listeners: {
drop : function(e) {
Ext.Ajax.request({
url: '<c:url value="/mysite/cockpit.html"/>',
params:{
json: true,
action: 'save',
panelsPositions: createPositionInMatrix(e.portal)
}
});
}
}


Do you have any ideas where the problem is? :-?