FullCalendar：显示反向列表视图

如何在列表视图中反转事件，使最具未来感日期的事件显示在开头（顶部）？

对于仍在查找此事件的人，使用jquery反转事件列表：

eventAfterAllRender: function(view) {
    var eventosRendered = $('#timeline tr');
    var eventosInversa = [];
    var headingPendiente = null;
    eventosRendered.map(function(key, evento) {
        switch(evento.className) {
            case 'fc-list-heading':
                if (headingPendiente) {
                    eventosInversa.unshift(headingPendiente);
                }
                headingPendiente = evento;
                break;
            case 'fc-list-item':
                eventosInversa.unshift(evento);
                break;
        }
    });
    eventosInversa.unshift(headingPendiente);

    $('#timeline tbody').append(eventosInversa);
}

---

@F.Mora您的解决方案几乎是完美的，但在我们的例子中，我们添加了一些自定义类名，并且在每个标题下都有多个项目

这是我们的增强版：

eventAfterAllRender: function(view) {
    var renderedEvents = $('.fc-list-table  tr');
    var reorderedEvents = [];
    var blockEvents = null;
    renderedEvents.map(function(key, event) {
        if ($(event).hasClass('fc-list-heading')) {
            if (blockEvents) {
                reorderedEvents.unshift(blockEvents.children());   
            }
            blockEvents = $('<tbody></tbody>');
        }
        blockEvents.append(event);
    });
    reorderedEvents.unshift(blockEvents.children());
    $('.fc-list-table tbody').html(reorderedEvents);
}

eventAfterAllRender:函数（视图）{
var renderEvents=$（'.fc list table tr'）；
var-reorderedEvents=[]；
var blockEvents=null；
renderEvents.map（函数（键、事件）{
if（$（事件）.hasClass（'fc-list-heading'））{
如果（阻止事件）{
reorderedEvents.unshift（blockEvents.children（））；
}
blockEvents=$（''）；
}
blockEvents.append（事件）；
});
reorderedEvents.unshift（blockEvents.children（））；
$（'.fc list table tbody'）.html（重新排序）；
}

以下是我使用的版本（fullCalendar v4）：

---

我在fullCalendar v5中使用了这个。它基于@Yo1-answer

    eventsSet: function(dateInfo){
      var renderedEvents = $('.fc-list-table  tr');
      var reorderedEvents = [];
      var blockEvents = null;
      renderedEvents.map(function(key, event) {
        if ($(event).hasClass('fc-list-day')) {
          if (blockEvents) {
            reorderedEvents.unshift(blockEvents.children());
          }
          blockEvents = $('<tbody></tbody>');
        }
        blockEvents.append(event);
      });
      if (blockEvents){
        reorderedEvents.unshift(blockEvents.children());
        $('.fc-list-table tbody').html(reorderedEvents);
      }
    },

eventsSet:function（dateInfo）{
var renderEvents=$（'.fc list table tr'）；
var-reorderedEvents=[]；
var blockEvents=null；
renderEvents.map（函数（键、事件）{
if（$（event.hasClass（'fc-list-day'））{
如果（阻止事件）{
reorderedEvents.unshift（blockEvents.children（））；
}
blockEvents=$（''）；
}
blockEvents.append（事件）；
});
如果（阻止事件）{
reorderedEvents.unshift（blockEvents.children（））；
$（'.fc list table tbody'）.html（重新排序）；
}
},

没有内置选项，因此您可以修改fullCalendar源代码以执行所需操作，也可以创建自己的自定义视图（，而不是快速任务）。如果失败，您可能会通过GitHub将其作为功能请求发送给维护人员。

    eventsSet: function(dateInfo){
      var renderedEvents = $('.fc-list-table  tr');
      var reorderedEvents = [];
      var blockEvents = null;
      renderedEvents.map(function(key, event) {
        if ($(event).hasClass('fc-list-day')) {
          if (blockEvents) {
            reorderedEvents.unshift(blockEvents.children());
          }
          blockEvents = $('<tbody></tbody>');
        }
        blockEvents.append(event);
      });
      if (blockEvents){
        reorderedEvents.unshift(blockEvents.children());
        $('.fc-list-table tbody').html(reorderedEvents);
      }
    },