使用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移動一起移動

回答

相關問題