[英]How do i place the first dragged item of JQuery Sortable in a dynamically generated div on beforeStop event
So, the issue is, i have my sortables placed into accordion categories, like this: 所以,问题是,我将我的可排序对象放入了手风琴类别中,如下所示:
http://i.stack.imgur.com/UiRKa.jpg http://i.stack.imgur.com/UiRKa.jpg
The accordion categories are not sortable, just the tags inside them, and i have the left container connected to the container on the right. 手风琴类别不是可排序的,只能是它们内部的标签,并且我的左侧容器连接到右侧的容器。
I'm actually checking the tag category when i drop it on the "What i want" container, i do this because i want to create a identical accordion category on the "What i want" container, with the tag i dragged, inside of it. 我将标签类别放到“我想要的”容器上时实际上正在检查标签类别,因为我想在“我想要的”容器上创建一个相同的手风琴类别,并拖动标签到它。
The problem is, when i drag the tag and generate the accordion, it works! 问题是,当我拖动标签并生成手风琴时,它就可以了! but not for the first time, only from the second attempt. 但不是第一次,仅是第二次尝试。
This don't work for the first time because i can't figure out a way to generate the accordion on the "What i want" container BEFORE the dragged tag, so it can be dropped on the accordion. 这是第一次无效,因为我无法找到一种在拖动标签之前在“我想要的”容器上生成手风琴的方法,因此可以将其放在手风琴上。
Here is my code: 这是我的代码:
beforeStop: function(event, ui) {
var categ = ui.item.attr('data-categoria');
console.log("Categoria do Objeto: " + categ);
if (categ == 'credenciamento') {
var container = $("#documentos_usados");
var newdiv = $("#doc_usado_credenciamento");
if (container.find(newdiv).length == 0) {
var div_credenciamento = "<div id='doc_usado_credenciamento' class='single-doc'><div class='title-single-doc'>Credenciamento</div></div><div><ul id='documentos_disponiveis' class='sub-accordion-doc allow-sort' style='margin-top:0px !important'></ul></div>";
container.append(div_credenciamento);
newdiv.append(ui.item);
};
}
}
I do not know if the information I spent help fully, if not, I update the post with what you ask. 我不知道我花费的信息是否能完全帮助您,如果没有,我会根据您的要求更新帖子。
Also, sorry for any english errors, it isn't my native language. 另外,对于任何英语错误,也很抱歉,这不是我的母语。
Thanks you all! 谢谢大家!
Hey there is a drop event available. 嘿,有一个掉落事件可用。 So instead of beforeStop you actually have to call the drop function. 因此,实际上必须调用drop函数来代替beforeStop 。 This method will be called prior to stop. 在停止之前将调用此方法。 So you can do like this : 所以你可以这样:
function drop (event, ui){
var categ = ui.item.attr('data-categoria');
console.log("Categoria do Objeto: " + categ);
if (categ == 'credenciamento') {
var container = $("#documentos_usados");
var newdiv = $("#doc_usado_credenciamento");
if (container.find(newdiv).length == 0) {
var div_credenciamento = "<div id='doc_usado_credenciamento' class='single-doc'><div class='title-single-doc'>Credenciamento</div></div><div><ul id='documentos_disponiveis' class='sub-accordion-doc allow-sort' style='margin-top:0px !important'></ul></div>";
container.append(div_credenciamento);
newdiv.append(ui.item);
};
}
}
I can only help you with where you have to put the code. 我只能为您提供放置代码的地方。 You have to make the logic what you want yourself. 您必须使自己想要的逻辑成为可能。 Else I would need a proper idea of the UI elements selectors. 否则,我需要对UI元素选择器有一个适当的了解。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.