Question

我正在使用Smart Admin Theme，目前我正在尝试使用calendar页面。

日历的基本功能已经定义并可以使用。可以在地图上创建和删除新事件。

我正在研究这些事件的持久性，我目前正在努力存储在数据库中放置在地图上的事件。定义了drop方法，该方法在日历上呈现事件，我稍微修改了它以向服务器发送ajax请求以存储事件。

以下是原始版本：

drop: function (date, allDay) { // this function is called when something is dropped

    // retrieve the dropped element's stored Event Object
    var originalEventObject = $(this).data('eventObject');

    // we need to copy it, so that multiple events don't have a reference to the same object
    var copiedEventObject = $.extend({}, originalEventObject);

    // assign it the date that was reported
    copiedEventObject.start = date;
    copiedEventObject.allDay = allDay;

    // render the event on the calendar
    // the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
    $('#calendar').fullCalendar('renderEvent', copiedEventObject, true);

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

},

这是我使用ajax调用的方法版本：

drop: function (date, allDay) { // this function is called when something is dropped

    // retrieve the dropped element's stored Event Object
    var originalEventObject = $(this).data('eventObject');

    // we need to copy it, so that multiple events don't have a reference to the same object
    var copiedEventObject = $.extend({}, originalEventObject);

    // assign it the date that was reported
    copiedEventObject.start = date;
    copiedEventObject.allDay = allDay;

    // render the event on the calendar
    // the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
    $('#calendar').fullCalendar('renderEvent', copiedEventObject, true);

    $.ajax({
        type: 'POST',
        url: '/events',
        data: copiedEventObject,
        success: function(response){
            console.log(response);
        },
        error: function(response){
            console.log(response);
        }
    });

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

},

我收到错误说：

TypeError：a未定义

此错误是我的moment.js库生成的。

我试着在我的ajax调用中注释掉几行，看起来这句话说：

data: copiedEventObject,

是负责任的人，因为当我评论它时，ajax调用是成功的，但我无法理解为什么。

也试过这个：

data: {
    title: copiedEventObject.title,
    description: copiedEventObject.description,
    class: copiedEventObject.className,
    start: copiedEventObject.start,
    end: copiedEventObject.end,
    icon: copiedEventObject.icon
},

得到了同样的错误。评论start。再次正常工作。

Chrome有一个更详细的错误：

未捕获的TypeError：无法读取未定义的属性'month'

Answer 1

尝试将数据属性更改为corect json：

data: JSON.stringify(copiedEventObject);

Answer 2

最终我不得不从copiedEventObject中取出数据并手动创建数据对象来发出请求。

$ .ajax在使用fullcalendar js时无法正常工作？

2 个答案: