Question

我正在使用 full calendar 和jquery ui对话框。

基本上这就是发生的事情。我有一些可拖动的事件，用户可以拖到他们的日历上。在他们的日历上，他们可以单击该事件以加载对话框进行编辑。

这是一个jquery ui对话框，也是可拖动的。现在我发现，如果我移动jquery对话框（此对话框就在日历上方），它会尝试将自己挂钩到日历。当发生这种情况时，我会发出一个ajax请求，用于保存可拖动事件所在的位置。

当然，因为这不是我期望请求失败并崩溃的事件。

关于如何阻止这种想法？

这是我修改的示例文件，用于显示正在发生的事情。

http://jsfiddle.net/Jaybles/dmqXv/

将对话框拖放到日历上。

Answer 1

不幸的是，John的解决方案并没有阻止将jquery对话框放到日历上。更好更简单的解决方案是使用FullCalendar选项＆＃34; dropAccept＆＃34;。

如FullCalendar＆＃34; Dropping External Elements＆＃34;例如，FullCalendar将可拖动事件框中的事件以及任何打开的jquery对话视为外部事件。

通过确保只有可拖动事件框中的外部事件标记为＆＃34; .external-event＆＃34;等类。并添加＆＃34; dropAccept＆＃34;使用＆＃34; .external-event＆＃34;的选项FullCalendar初始化的类名，拖放打开的jquery对话框时不会触发FullCalendar drop选项。

$('#calendar').fullCalendar({
dropAccept: '.external-event',
drop: function() {
}
});

当然，您必须确保没有使用相同的类名标记jquery对话框。

日历上已有的事件不会受到影响，因为它们不被视为外部事件。

Answer 2

我知道这是旧的，但我也有这个问题（除了我只是从屏幕上移除），因为我使用完整日历中的相同代码为您删除事件。基本上你只需要将你的drop代码包装在if语句中，这样它只能执行某些事情。是的，我知道这很简单，但由于某种原因，我认为drop函数从屏幕中删除了这个元素，但它并不是这个完整日历附带的代码，但这对我来说就是问题。

drop: function(date, allDay) { // this function is called when something is dropped
    if($(this).hasClass("external-event")) {
        // add all existing drop code here
    }
}

这应该会阻止日历采用jquery ui draggable模式，以及除了类外部事件之外的所有其他draggable。

怎么阻止这个？使用完整日历拖放+ jquery ui对话框（具有拖放功能）

2 个答案: