使用Dojo拖放和Dojo移动一起移动

我正在使用Dojo.dnd在各区域之间传输项目。问题是：一旦我放下它们，物品就会卡入到位，但我希望让它们留在我放置的地方，但只限于一个区域。使用Dojo拖放和Dojo移动一起移动

这里有一个小的代码来解释这更好：

<div id="dropZone" class="dropZone"> 
    <div id="itemNodes"></div> 
    <div id="targetZone" dojoType="dojo.dnd.Source"></div> 
    </div>

“悬浮窗” 是包含两个dojo.dnd.Source -areas， “itemNodes”（程序创建）和 “targetZone” 一个DIV。项目（带有图像的DIV）应该从简单的列表中拖出“itemNodes”到“targetZone”并保持它们被放置的位置。只要他们被拖出“targetZone”，他们应该回到“itemNodes”内的列表。

下面是我用它来创建项目代码：

var nodelist = new dojo.dnd.Source("itemNodes"); 
    {Smarty-Loop} 
    nodelist.insertNodes(false, ['<img class="dragItem" src="{$items->info.itemtext}" alt="{$items->info.itemtext}" border="0" />']); 
    {/Smarty-Loop}

可是这样我只是有一个项目的两个列表，项目投进“targetZone”不会留在我放弃了他们。我已经尝试了循环dojo.query(".dojoDndItem").forEach(function(node)抓住所有项目并将其更改为“可移动”型：

使用dojo.dnd.move.constrainedMoveable将更改的项目，使他们能够总是随意移动（即使在“itemNodes”）
使用dojo.dnd.move.boxConstrainedMoveable并且将“box”定义为“targetZone”的边框使得它可以在“targetZone”内移动物品，但是一旦我放下物品，我就无法抓住并移动它们。（奇怪：dojo.connect(node, "onMoved"不会在这里工作，甚至会不火，不管是什么。）

所以这里的问题：是否有可能创建两个dnd.Sources在那里我可以移动的物品来回并让这些物品仅在其中一个来源中“可移动”？
或者是否有一种解决方法，如使物品可移动，如果它们没有放入“targetZone”，它们会自动移回“itemNodes”中的列表？

提交页面后，我必须保存已放置到“targetZone”中的每个项目的位置。（如果网格已经被填充，下一步将在页面加载时将这些项目放置在“targetZone”内部，但是如果网格已经被填充，我会很高兴。）

任何提示是赞赏。

问候，Select0r

来源

2010-03-31 Select0r

有这样的功能没有直接的支持。它可以用自定义代码完成，例如，通过继承Source并覆盖它的insertNodes()。

来源

2010-03-31 22:36:01

太糟糕了，不过谢谢。我想，只要我遇到自定义解决方案，我会再打开一个问题:) – Select0r 2010-04-06 08:04:33

这里有一个快速的解决办法得到这个工作：

最后我只使用一个DIV这是一个dojo.dnd.Source和包含应投进一个“悬浮窗”，并在其四处移动，同时回弹到项目项目列表放置在dropZone外部时。

所有物品都是dojo.dnd.move.parentConstrainedMoveable，使它们可以在原始DIV中移动。连接到onMoveStop将使我有机会决定是否在dropZone或其他地方发生“drop”。

if (coordX >= (dropCoords.l + dropAreaX) && 
     coordX <= (dropCoords.l + dropAreaX + dropAreaW) && 
     coordY >= (dropCoords.t + dropAreaY) && 
     coordY <= (dropCoords.t + dropAreaY + dropAreaH)) 
    { 
    // OK! 
    } 
    else 
    { 
    // outside, snap back to list 
    }

dropAreaX和dropAreaY包含其中悬浮窗开始，dropAreaW和dropAreaH包含其宽度和高度坐标。

如果“OK！”，项目将被保存到一个数组中，所以我知道哪些项目已被删除。否则，该项目将从该数组中移除（如果它在那里）并且该项目将被放回到列表中（通过CSS“left：0”）。数组中的元素数量会告诉我列表中剩下多少元素，所以我可以使用“top：numberOfElement * heightOfElement px”将它们“堆叠”在一个循环中。

还有更多的，因为我需要将项目坐标写入隐藏的字段，但我想这应该让任何人在正确的轨道上处理类似的问题。

来源

2010-04-07 16:00:24 Select0r

使用Dojo拖放和Dojo移动一起移动

回答

相关问题