javascript - 当时间不是全日全日历时，无法调整事件大小

Question

我已经搜索了大约两天的答案，但直到现在仍然没有运气。请帮我弄清楚。当事件不是 allDay 时，调整大小不起作用，并且事件结束时不会显示调整大小图标。但当事件为 allDay 时，它现在可以调整大小。我已经尝试过放置 allDay: true 和 allDay: false 但它不起作用。如果 allDay: true 调整大小后所有时间都会变成 allDay。请帮助我。

这是我的代码。

$(document).ready(function() {
  $('#calendar').fullCalendar({
    header: {
      left: 'today add_event',
      center: 'prev title next',
      right: 'month,basicWeek,basicDay'
    },
    eventOrder: 'start',
    editable: true,
    eventLimit: true,
    selectable: true,
    selectHelper: true,
    select: function(start, end) {
      $('#ModalAdd #start').val(moment(start).format('YYYY-MM-DD HH:mm:ss'));
      $('#ModalAdd #end').val(moment(end).format('YYYY-MM-DD HH:mm:ss'));
      $('#ModalAdd').modal('show');
    },
    eventRender: function(event, element) {
                element.bind('dblclick', function() {
                        $('#ModalEdit #id').val(event.id);
                        $('#ModalEdit #start').val(event.start.format('dddd, MMM DD-YYYY'));
                        $('#ModalEdit #end').val(event.end.format('dddd, MMM DD-YYYY'));
                });
    },
    eventDrop: function(event, delta, revertFunc) {
      edit(event);
    }
    eventResize: function(event,dayDelta,minuteDelta,revertFunc) {
      edit(event);
    },
    events: [
      <?php 
        foreach($events as $event): 
            $start = explode(" ", $event['start']);
            $end = explode(" ", $event['end']);
        if($start[1] == '00:00:00'){
            $start = $start[0];
        }else{
            $start = $event['start'];
                              }
        if($end[1] == '00:00:00'){
            $end = $end[0];
        }else{
            $end = $event['end'];
        }
  ?>
        {
        id: '<?php echo $event['id']; ?>',
        title: '<?php echo $event['title']; ?>',
        start: '<?php echo $start; ?>',
        end: '<?php echo $end; ?>',
      },
    <?php endforeach;?>
    ],

});
function edit(event){
  start = event.start.format('YYYY-MM-DD HH:mm:ss');
  if(event.end){
    end = event.end.format('YYYY-MM-DD HH:mm:ss');
  }
  else{
    end = start;
  }
  id =  event.id;
  Event = [];
  Event[0] = id;
  Event[1] = start;
  Event[2] = end;
  $.ajax({
    url: 'editEventDate.php',
    type: "POST",
    data: {
      Event:Event}
    ,
    success: function(rep) {
      if(rep == 'OK'){
      }
      else{
        alert('Could not be saved. try again.');
      }
    }
  }
);
}
}
);

我不知道问题到底出在哪里。我只想调整事件的大小，无论时间是否为全天。目前我只能在时间为 00:00:00 时调整它的大小。 fullcalendar 是否禁用了非 allDay 事件的大小调整？如果是，我可以删除它吗？这样我就可以只调整日期大小并保持事件的时间。

Answer 1

您的日历使用“月”和“基本”样式 View 。但这些 View 都不允许按时间调整大小，只能按天调整大小。这些 View 没有任何类型的时间段，那么您如何期望能够按时间调整大小呢？日历不知道要延长多少，用户也不知道要拖动事件多大才能实现所需的时间更改。

如果您想按时间调整大小，则必须使用“议程”样式 View 。

header: {
  left: 'today',
  center: 'prev title next',
  right: 'month,agendaWeek,agendaDay'
},

会将这些 View 添加到您的日历中。

请参阅此处的演示:http://jsfiddle.net/sbxpv25p/419/ - 在“议程” View 中，您可以按时间拖动并调整大小。