首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >fullCalendar使用eventAllow根据给定的DateTime限制事件

fullCalendar使用eventAllow根据给定的DateTime限制事件
EN

Stack Overflow用户
提问于 2017-04-25 20:11:49
回答 1查看 927关注 0票数 0

我正在尝试限制我的事件,以便它们只能在每个事件中的给定时间之前被删除。当我在约会前倒下的时候,它工作得很好。然而,当我拖到给定日期之后,事件就消失了;我错过了什么?我正在使用ASP.NET MVC来填充我的日历。

我的代码:

代码语言:javascript
运行
复制
        $("#calendar")
        .fullCalendar({
            header: {
                left: "agendaWeek month",
                center: "title",
                right: "prev, today, next"
            },
            defaultView: "agendaWeek",
            //click on a day in the month view to go to that week
            dayClick: function (date, jsEvent, view) {
                if (view.name === "month") {
                    $("#calendar").fullCalendar("changeView", "agendaWeek");
                    $("#calendar").fullCalendar("gotoDate", date);
                }
            },
            editable: true,
            timeFormat: "H:mm",
            droppable: true,
            timezone: "Europe/London",
            eventLimit: true,
            eventSources: [

                "/Home/GetCalendar"
            ],
            dragRevertDuration: 0,
            allDaySlot: false,
            minTime: "07:00:00",
            firstDay: 1,
            aspectRatio: 1.97,
            //this moves events from tray to calendar
            drop: function (date, jsEvent, ui, resourceId) {
                UpdateEvent($(this).attr("uniqueId"), date);
                $(this).remove();
            },
            eventDragStop: function (event, jsEvent, ui, view) {
                //if the event is hovering over the tray
                if (isEventOverDiv(jsEvent.clientX, jsEvent.clientY)) {
                    $("#calendar").fullCalendar("removeEvents", event.uniqueId);
                    //adds to the panel 
                    UpdateEvent(event.uniqueId, "");
                }
            },
            //adds description underneath title
            eventRender: function (event, element) {
                if (event.location !== "") {
                    element.find(".fc-content").append(event.location);
                } else {
                    element.find(".fc-content").append(event.assignmentName + "<p>" + event.moduleName + "</p>");
                }
                element.find(".fc-content").qtip({content: {
                    text: event.details
                }});
            },
            //this sends a pop up to confirm the drop - probably don't need all the time
            eventDrop: function (event, delta, revertFunc, jsEvent, ui, view) {
                if (confirm("Confirm move?")) {
                    UpdateEvent(event.uniqueId, event.start);
                } else {
                    revertFunc();
                }
                //UpdateEvent(event.uniqueId, event.start);
            },
            eventAllow: function (dropLocation, draggedEvent) {
                var day = moment(draggedEvent.dueDate);
                if (dropLocation.start > day) {
                    return false;
                }
            },
            eventClick: function (event) {
                $.ajax({
                    type: "GET",
                    url: "/Home/EditEventView",
                    data: { eventId: event.uniqueId },
                    success: function (response) {
                        ModalControl("#editEventModal");
                        $("#editEventModal").html(response);
                    }
                });
            },
            theme: true
        });

编辑:

我的活动使用asp.net和Json通过提要传递到我的日历中。在一些背景下,这个应用程序是为大学生提供的日历。我忽略了使用实体框架从数据库获取,但基本上它填充了一个事件列表,然后我传递了一个新的列表,如下所示。代码:

代码语言:javascript
运行
复制
            var newRows = rows.Select(e => new
        {
            uniqueId = e.EventId,
            title = e.Title,
            start = e.StartTime,
            end = e.EndTime,
            details = e.Details,
            location = e.Location,
            className = e.ClassName,
            editable = e.Editable,
            module = e.Module.ModuleId,
            assignment = e.Assignment.AssignmentId,
            assignmentName = e.Assignment.Title,
            moduleName = e.Module.ModuleName,
            color = e.Module.Color,
            dueDate = e.DueDate
        }).ToList();
        return Json(newRows, JsonRequestBehavior.AllowGet);
EN

Stack Overflow用户

发布于 2017-04-26 16:56:25

所以我找到了一个解决方法。基本上,当我使用外部事件时,我有一个Javascript方法,它允许将我创建的div从旁边的托盘拖到日历中。我使用的是draggable类,这与日历本身对draggable类的使用有冲突,所以它变得混乱了。我将获取托盘项目时使用的类重命名为"external“,这似乎解决了这个问题

代码语言:javascript
运行
复制
function EnableDragging() {
  $(".external").each(function () {
    $(this).draggable({
        zIndex: 999,
        revert: true,
        revertDuration: 0
    });
  });
}
票数 0
EN
查看全部 1 条回答
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/43610306

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档