jQuery fullcalendar:如何保存拖动和重新调整大小的项目

Question

从昨天开始，我一直在寻找一种使用jQuery fullcalendar保存（mysql+php）拖动和重新调整大小的项目的方法。这里没有教程，只有几个例子。有人能发布他的工作json.php、json-events.php和外部数据库更新脚本吗？或者引导我找到最好的解释、教程或示例？

我正在努力让这个完全工作

非常感谢所有的帮助！

Answer 1

它可能不能完全回答您的问题，但希望这能为您指明正确的方向。基本上，我也在尝试做同样的事情，但在ASP.NET中，使用日历作为数据操纵器，以某种方式从日历中捕获更新的事件，并将其发送回服务器进行更新。

我注意到有一些事件回调可能很有用。

1. eventDrop回调-在日历上删除/移动事件时触发http://arshaw.com/fullcalendar/docs/event_ui/eventDrop/

2. eventResize回调-在调整事件大小时触发http://arshaw.com/fullcalendar/docs/event_ui/eventResize/

我想您可以使用所涉及的事件详细信息对服务器进行ajax调用，以便相应地更新事件。

Answer 2

根据FullCalendar V4文档-https://fullcalendar.io/docs/eventResize

如果要使用可接受的格式保存和检索开始和结束日期，请使用.toISOString()

var calendar = new Calendar(calendarEl, {
 events: [
   // events here
 ],
 editable: true,
 eventResize: function(info) {
   alert(info.event.title + " end is now " + info.event.end.toISOString());
   if (!confirm("is this okay?")) {
     info.revert();
   }
 }
});

Answer 3

完整日历v4在文档的帮助下

在您的日历选项中

eventDrop: function(info) {
  if(!confirm("Are you sure about this change?")) {
  info.revert();
}
  modifyEvent(info.event);

使用ajax 进行更新

<script>
function modifyEvent(event) {
  var start = event.start;
  var end = event.end;
  $.ajax({
    type:"POST",
    url:"/appointment/update",
    data:{"id":event.id,"start":start,"end":end},
    traditional:true,
    success:function(msg){
      console.log(msg);
    },
    error:function(msg){
      console.log(msg);
      alert('We are unable to process your request');
    }
  });
}
</script>