如何在拖动时阻止jQuery元素被克隆?

时间:2013-07-16 16:36:16

标签: jquery jquery-clone

我是jQuery相对较新的设计师,所以请耐心等待我!

我已经基于jQuery购物车模型整理了一个数据库查询创建程序。

此时,用户将字段名称和布尔运算符拖放到“购物车”区域并删除它们,从而创建可以转换为逗号分隔字符串并保存为查询的元素列表。被拖动的元素实际上是orignal的克隆。

购物车区域中元素的基本顺序是:

field name, boolean, constant or field name, optional and/or, etc.

这样你最终可能得到一个像这样的字符串:

product,equals,hardcoverbook,and,pubdate,lessthan,12/31/13

与:

相同
Product = HardcoverBook AND PubDate < 123113

为了在查询创建区域中保留逻辑序列,在删除字段后通常禁用所有字段,从而限制用户拖动操作符;删除布尔运算符后禁用所有布尔运算符。否则,您最终可能会遇到无意义的查询,例如:

has,greaterthan,hardcoverbook,newspaper

当删除字段或运算符时,应该可以通过将其拖到废纸篓来删除它。

同时,前一个元素不再是可删除的 - 否则,用户可能会通过随机删除元素来破坏查询。

例如,在“el”是拖放的字段名称的情况下,“删除”类作为drop函数的一部分添加到它中,并从之前的列表elemet中删除:

$(el).addClass("deletable").prev('li').removeClass("deletable");

这部分工作正常,即可以删除最后删除的列表元素,并且不能删除以前的列表元素。

我遇到的问题是,如果用户将已删除的列表元素拖放到查询创建区域[“cart”],则会创建该列表元素的克隆。然后,可以拖动该克隆,从而创建另一个克隆。

由于原始drop事件在删除的字段名称或运算符之后附加逗号[以便以逗号分隔的字符串结尾],我认为拖动删除的字段是重新创建初始drop事件?您可以看到,因为每次拖动停止时都会将逗号附加到每个克隆。

我可以阻止被删除的元素在被拖动时被克隆,如果我让“cart”div不可排序 - 但是我不能将它们拖到垃圾桶中:

$("#cartInv ol").droppable({
    accept: "(#catalogProd2 li,#boolean li,#and_or li,#constant li)",
    accept: ":not(#catalogInv li,#catalogProd2 li,#catalogRB1 li,#catalogRB2 li)"
    }
    ).sortable("disable");

所以 - 对不起我的啰嗦 - 总而言之,我需要帮助防止被删除的元素在被拖动时被克隆,同时保持它“可删除”,以便可以将其拖到垃圾桶。

我有一个完整的页面工作版本,显示了克隆问题:

http://tinyurl.com/nr4tpbp

第二页显示“推车”不可排序时的行为 - 该元素无法拖动,因此无法克隆,但也无法拖到垃圾箱:

http://tinyurl.com/qcawmax

非常感谢任何帮助!

0 个答案:

没有答案