[英]How to self-submit a web2py-component at change-event
I load two different components (A,B), where i can drag and drop elements from A to B. 我加载了两个不同的组件(A,B),可以在其中将元素从A拖放到B。
Is it possible to trigger a "self-submit" on component B and pass arguments when the drag-target container is changed? 更改拖动目标容器时,是否可以在组件B上触发“自我提交”并传递参数? Thanks in advance.
提前致谢。
Edit 1: The components are very simple solutions, A displays a list which elements can be dragged (and dropped to B), B is empty in the beginning. 编辑1: 组件是非常简单的解决方案,A显示一个列表,其中的元素可以拖动(拖放到B),B开头是空的。 I want to achieve that if en element is dropped into B, informations on the element are passed to the controller.
我想要实现的是,如果将en元素放入B中,则该元素上的信息将传递给控制器。
Edit 2: Meanwhile I am able to trigger an event when the element is dropped. 编辑2:同时,当元素被删除时,我能够触发一个事件。 I used a small Drag-and-Drop script called Dragula ( http://bevacqua.github.io/dragula/ ) - the event is triggered like this:
我使用了一个名为Dragula的小型拖放脚本( http://bevacqua.github.io/dragula/)-事件触发如下:
dragula([document.querySelector(".draggable"),document.querySelector(".drag-target")]).on("drop", function () { console.log("This Works!");});
You can answer to your drag event with something like: 您可以通过以下方式回答拖动事件:
web2py_component("/app/default/comp_b.load?yourpar=1","comp_b_id");
where comp_b_id is the id of your component_b without # 其中comp_b_id是您的component_b的ID,不包含#
With Massimilianos hint and this answer I came up with this solution: 有了Massimilianos提示和这个答案,我想出了以下解决方案:
Component A (where the drag starts) now contains this script: 组件A(拖动开始的地方)现在包含以下脚本:
<script>
/* Provides Drag and Drop functionality */
d = dragula([document.querySelector(".drag-start"), document.querySelector(".drag-target")]);
d.on('drop', function(el) {
var test1, test2, id;
test1 = 'test1'; /* Some information */
id = $('.drag-target').attr('id'); /* The target ID */
/* Pass data to the controller */
$.post("{{=URL('controller', 'function')}}"+"/"+test1);
/* Reload data to the target id */
x = web2py_component("/app/controller/function.load"+"/"+id);
});
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.