在jquery fullcalendar中，我可以添加一个新事件而不刷新整个月吗？

我正在使用，效果很好。我的事件来自ajax调用，并以json的形式返回

我试图找出是否有一种方法可以在不刷新整个服务器的情况下从客户端添加事件

我可以在代码中添加新事件（将其添加到数据库中），但我知道如何刷新UI以显示此新事件的唯一方法是调用refetchevents（但这会从服务器重新加载当月的所有内容）

我是否可以在所有客户端添加额外的事件以避免整个月的事件刷新

我看到我可以通过removeEvents方法（使用id过滤器）逐个删除事件，但我看不到添加事件的等效方法

更新： 我有一个后续问题，给出了下面的答案，这两个问题都有效。（创建另一个问题没有意义）。我想看看在客户端上“刷新”单个事件的推荐方法。我试图简单地用相同Id的事件调用“renderEvent”，但这会在日历上创建一个新事件

我看到了：UpdateEvent方法，我假设它就是答案，但这似乎只有在eventClick中才起作用（您不能只创建一个新的事件对象，设置Id并更改字段并调用update）

 http://arshaw.com/fullcalendar/docs/event_data/updateEvent/

是否有类似于下面的“添加客户端”事件逻辑的从客户端刷新事件的推荐方法

现在，我正在删除和阅读这样的事件：

       $('#calendar').fullCalendar('removeEvents', data.Event.id);
       $('#calendar').fullCalendar('renderEvent', data.Event, true);

---

要将客户端上的事件添加到完整日历中，您可以调用：

var myCalendar = $('#my-calendar-id'); 
myCalendar.fullCalendar();
var myEvent = {
  title:"my new event",
  allDay: true,
  start: new Date(),
  end: new Date()
};
myCalendar.fullCalendar( 'renderEvent', myEvent );

---

我还没有测试这段代码，但这应该可以完成工作。

以下是我使用的代码：

function addCalanderEvent(id, start, end, title, colour)
{
    var eventObject = {
    title: title,
    start: start,
    end: end,
    id: id,
    color: colour
    };

    $('#calendar').fullCalendar('renderEvent', eventObject, true);
    return eventObject;
}

---

您不需要添加和删除事件来更新它们。您只需要从日历中获取事件并将其传递给updateEvent方法：

    function updateCalanderEvent(id, start, end, title, colour)
    {
        var eventObject = $('#calendar').fullCalendar( 'clientEvents', id )

        if (eventObject != null)
        {
            eventObject.title = title;
            eventObject.start = start;
            eventObject.end = end;
            eventObject.color = colour;

            $('#calendar').fullCalendar( 'updateEvent', eventObject );
        }
        return eventObject;
    }

---

我试图编辑一个像你一样的现有事件，但在我的情况下，我需要它使用相同的id，因此我无法删除该事件并创建另一个事件，因为这样做效果不太好

遵循

我发现你需要传递给句子的事件是： $（'#calendar'）.fullCalendar（'updateEvent'，eventObject）； 不能是任何对象。它应该是fullcalendar的事件，这就是为什么它对eventClick事件非常有效，但不能在这些事件之外

要在fullCalendar事件之外使用它，以下代码适用于我：

function updateEvent(id, title, date) {

    i = id;

    /*This is the id of the event on full calendar,
    in my case i set this id when I create each event*/

    event = $('#calendar').fullCalendar( 'clientEvents', [i] )[0];
    /*This method returns an array of object with id == i
    That's why is necessary to aggregate [0] at the end 
    to get the event object.*/

    if (event != null){
        //make your modifications and update
        event.title = title;
        event.start = date;
        $('#calendar').fullCalendar( 'updateEvent', event );
    }
}

希望它对任何人都有效！

这个怎么样

$("#calendar").fullcalendar('addEventSource', yourEvent); 

---

我发现最好的不回发刷新的方法是

 $('#calendar').fullCalendar('removeEvents', data[0].id);
 $('#calendar').fullCalendar('addEventSource', data);

数据必须是“removeEvents”的ID或筛选器

对于ajax，“addEventSource”的数据需要是数组/URL/函数

function DeploySchedule(){
    $.ajax({
        type: "POST"
        , url: "/Services/ScheduleService.svc/DeploySchedule"
        , contentType: "application/json; charset=utf-8"
        , dataType: "json"
        , success: function (result) {
            $('#calendar').fullCalendar('removeEvents');

            result.forEach(function (_row) {
                var event = new Object();
                event.title = _row.TrackingNumber + " (" + _row.Worker + ")";
                event.start = _row.Date;
                event.WorkerGuid = _row.WorkerGuid;
                event.ScheduleGuid = _row.ScheduleGuid;
                event.TrackingNumber = _row.TrackingNumber;
                event.Worker = _row.Worker;
                $('#calendar').fullCalendar('renderEvent', event);
            });
        }
        , error: function (xhr, status, error) { // if error occure
            alert(xhr.responseText);
        }
        , complete: function () {
        }
    });
}

---

初始化日历，然后添加单击事件：

document.addEventListener('DOMContentLoaded', function () {

     var calendarEl = document.getElementById('calendar');

     var calendar = new FullCalendar.Calendar(calendarEl, {/*OPIONS*/});

     calendar.render();

     calendar.on('dateClick', function(info) {

         addNew(info);
     });
});

将事件添加到日历中：

function addNew(info){
     var myEvent = {
         title:"my new event",
         start: info.dateStr,
         end: info.dateStr
     };
     calendar.addEvent(myEvent);
}

---

如果要刷新现有事件，我将如何在更新中执行此操作。我必须删除并添加新事件吗？我没有看到任何“updateRenderEvent”，调用“renderEvent”似乎会创建一个新事件是的，删除并重新添加它应该可以工作。我找不到“update”事件本身您可以使用updateEvent选项更新事件：谢谢，这非常有效。我在原始问题的基础上添加了一个后续问题。在这种情况下，id是什么？什么是

开始

和

结束

格式？ISO 8601？为什么需要返回？如果您想添加事件对象的

数组

只有一个事件。

$（“#calendar”）.fullcalendar（'addEventSource'，yourEventsArray）

源可以是一个数组/URL/函数，就像在事件选项中一样。事件将立即从此源获取并放置在日历上。请检查参考。添加更多详细信息以证明您的答案。