FullCalendar постоянно показывает повторяющееся событие, несмотря на дату начала / истечения срока действия, которая поступает из JSON, но хорошо работает с данными из массива

Question

Я пытаюсь создать простой планировщик, используя FullCalendar, и когда я беру данные из JSON, он не видит даты начала / окончания, хотя не имеет проблем при жестком кодировании массива.

Calendar.js

var calendar = $('#calendar').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay,listMonth'
    },
    eventRender: function (event, element, view) {
        var theDate = event.start
        var endDate = event.dowend;
        var startDate = event.dowstart;

        if (theDate >= endDate) {
            return false;
            }
        if (theDate <= startDate) {
            return false;
            }
    },
    events: [{
            id: 1,
            title: "Front End",
            start: '15:00',
            end: '17:00',
            dow: [1],
            dowstart: new Date('2018-06-03'),
            dowend: new Date('2018-06-17'),
        color:'grey'
    }],
    eventSources: [{
        url: 'schedule.php',
        type: 'GET',
        },
    }],
});

Schedule.php

 $events = array();
foreach ($response as $var) {
    $temp['id'] = $var['id'];
    $temp['title'] = stripslashes($var['title']);
    $temp['start'] = $var['start'];
    $temp['end'] = $var['end'];
    $temp['dow'] =  array($var['dow']);
    $temp['dowstart'] = date("Y-m-d", strtotime($var['dowstart']));
    $temp['dowend'] = date("Y-m-d", strtotime($var['dowend']));
    $events[] = $temp;
}

    echo json_encode($events);

Вывод файла: json-response.img

Хотя данные массива events в calendar.js и JSON-ответ в schedule.php совпадают, я получаю неожиданный результатпо моему

index.html

final-result.img

Answer 1

Проблема в том, что dowstart и dowend - это просто строки, а не даты.Таким образом, сравнение «больше или меньше» для них делает простое сравнение строк, а не сравнение дат, и, конечно, это ненадежно для вашей цели.

Если вы конвертируете их в объекты momentJS перед выполнениемтогда сравнение работает корректно:

var endDate = moment(event.dowend);
var startDate = moment(event.dowstart);

См. http://jsfiddle.net/sbxpv25p/744/ для рабочей демонстрации.

PS Если вам интересно, почему то же самое не нужно для события *Свойства 1012 * и end, потому что это стандартные свойства, которые fullCalendar ожидает получить для события, и когда он их получает, он автоматически преобразует их в объекты momentJS (если они еще не получены).Очевидно, что с вашими пользовательскими свойствами он не знает, что вы хотите, чтобы они рассматривались как даты, поэтому вам нужно реализовать это самостоятельно.