为全日历中的外部事件重置（左上宽度 css 样式）

Question

$scope.ctrlstartDragging = function(id) {

            var book = document.getElementById(id);
            var domRect = book.getBoundingClientRect();
                book.style.position = 'fixed';
                book.style.top = domRect.top + 'px';
                book.style.left = domRect.left + 'px';
                book.style.width=(domRect.width) + 'px';

        };
        $scope.ctrlendDragging = function(id) {

           var book = document.getElementById(id);
                book.style.position = 'relative';
                book.style.top = 'unset';
                book.style.left = 'unset';
                book.style.width='unset';
        };

当我在对外部事件应用过滤器后清除输入搜索时最后放入日历的事件上升到顶部（好像 $scope.ctrlstartDragging = function(id) 仍然立即自动应用在它上面（最后放入日历的事件）。

重现（link底部的codePen）：

1- 拖放到日历事件 4

2- 从输入搜索中查找 111 事件

3- 将过滤器找到的 111 事件拖放到日历中

4- 手动或点击清除按钮清除过滤器

如您所见，最后一个放入日历的事件 111 上升到顶部。

不应该的应该重新整合到列表中。

ondragstart => $scope.ctrlstartDragging = function(id) 仍在对该事件进行操作并且 ondragend => $scope.ctrlendDragging = function(id) 是 unfired.

并查看更多问题:

1- 刷新浏览器

2-取消选中拖框后删除

3- 将任何事件拖放到日历中

如您所见，最后放入日历的事件会出现在外部事件框的顶部。

我的问题是如何触发一本书的 ctrlendDragging 和 unset/reset（左上宽度 css 样式）以恢复到之前的第一个主要 css 样式我们操作有没有拖拽或移动？

codePen

相关：

非常感谢。

Answer 1

drop: function() {

                // reset 
                var reccupuredIndexForTitle=$(this).attr('id');
                $scope.ctrlendDragging(reccupuredIndexForTitle);


                // is the "remove after drop" checkbox checked?
                if ($('#drop-remove').is(':checked')) {
                    // if so, remove the element from the "Draggable Events" list
                   $(this).remove();


                }
            }

我把它作为一种解决方法，但我不明白为什么 ondragend 不触发，因此不触发 $scope.ctrlendDragging

Working CodePen

为全日历中的外部事件重置（左上宽度 css 样式）

reseting (top left width css styles) for an external event in fullcalendar

css

angularjs

drag-and-drop

fullcalendar

ng-animate