Могу ли я получить в событии FullCalendar dayClick события, которые уже существуют в выбранную дату?

Могу ли я получить в событии FullCalendar dayClick события, которые уже существуют в выбранную дату?

http://arshaw.com/fullcalendar/docs/mouse/dayClick/

Позвольте мне немного рассказать о моем проекте. Я пишу простой сайт php, который позволяет пользователю добавлять /редактировать события в календаре.

  • Только одно событие может добавить к дате.
  • Если пользователь щелкнет пустую дату, появится всплывающее окно «Новое событие» (я использую событие «Dayclick»).
  • Если пользователь щелкнет дату с существующим событием, появится всплывающее окно «Изменить событие» (я использую событие eventclick).

Проблема заключается в том, что когда пользователь щелкает за пределами области события (верхней или нижней области) даты с существующим событием, он вызывает щелчок мышью вместо щелчка по событию. Как я могу вызвать событие eventclick и пропустить событие dayclick, если в дате уже есть событие?

12 голосов | спросил zawmn83 25 MarpmThu, 25 Mar 2010 16:52:06 +03002010-03-25T16:52:06+03:0004 2010, 16:52:06

5 ответов


0

Ваши события хранятся на стороне клиента или на стороне сервера? Если это на стороне клиента, это должно сработать, особенно если вы хотите, чтобы событие произошло в указанное время:

$('#calendar').fullCalendar({
    dayClick: function(date, allDay, jsEvent, view) {
            $('#calendar').fullCalendar('clientEvents', function(event) {
                if(event.start <= date && event.end >= date) {
                    return true;
                }
                return false;
            });
    }
});

Это даст события, которые перекрывают время щелчка и хранятся на стороне клиента. Для слота на весь день будут показаны все события, перекрывающие этот день.

Если вы хотите, чтобы все события происходили в эту дату, независимо от того, был ли щелкнут слот allDay или временной интервал.

$('#calendar').fullCalendar({
    dayClick: function(date, allDay, jsEvent, view) {
            if(!allDay) {
                // strip time information
                date = new Date(date.getFullYear(), date.getMonth(), date.getDay());
            }
            $('#calendar').fullCalendar('clientEvents', function(event) {
                if(event.start <= date && event.end >= date) {
                    return true;
                }
                return false;
            });
    }
});

Если ваши события хранятся на сервере, вам нужно взять дату, указанную в обратном вызове dayClick, и использовать ее для создания вызова на ваш сервер, чтобы получить информацию в любом формате, который вам нужен.

РЕДАКТИРОВАТЬ Если вы совершаете поездку в оба конца или пытаетесь получить информацию другими способами

$('#calendar').fullCalendar({
    dayClick: function(date, allDay, jsEvent, view) {
            var startDate = new Date(date.getFullYear(), date.getMonth(), date.getDay(), 0, 0, 0).getTime();
            var endDate = new Date(date.getFullYear(), date.getMonth(), date.getDay(), 23, 59, 59).getTime();
            var cache = new Date().getTime();
            $.getJSON("/json-events.php?start="+startDate+"&end="+endDate+"&_="+cache,
                function(data) {
                    // do stuff with the JSOn data
                }
    }
});

И если вы не хотите получать туда-обратно, вы также можете взглянуть на то, что происходит, скажем, в refetchEvents в fullCalendar.js. Если вы не возражаете против отклонения от ствола fullCalendar, вы можете где-то сохранить извлеченные события, чтобы не выполнять кучу манипуляций с DOM (в зависимости от количества событий, поскольку они становятся большими, что становится громоздким). /р>

ответил justkt 25 MarpmThu, 25 Mar 2010 17:13:25 +03002010-03-25T17:13:25+03:0005 2010, 17:13:25
0

Я только что столкнулся с этой проблемой сам, находя решение для ввода выходных дней в календарь. Я обнаружил, что это хорошее решение для мероприятий на целый день. Я надеюсь, что это может помочь кому-то еще дальше.

$('#calendar').fullCalendar({                
    eventClick: function (event) {
        ShowEditScreen(event.id);
    },
    dayClick: function (date) {
        var events = $('#calendar').fullCalendar('clientEvents');
        for (var i = 0; i < events.length; i++) {
            if (moment(date).isSame(moment(events[i].start))) {
                ShowEditScreen(events[i].id);
                break;
            }
            else if (i == events.length - 1) {
                ShowCreateNew(date);
            }
        }
    }
});
ответил Krizzy 29 +03002015-10-29T13:22:29+03:00312015bEurope/MoscowThu, 29 Oct 2015 13:22:29 +0300 2015, 13:22:29
0

Превышенные ответы мне не помогли, поэтому есть рабочий код:

dayClick: function (date, jsEvent, view) {
    var count = 0;

    date = date.toDate();
    var startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate(), 0, 0, 0);
    var endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate(), 23, 59, 59);

    $('#calendar').fullCalendar('clientEvents', function (event) {
            if (event.start.toDate() >= startDate && event.start.toDate() <= endDate
                || event.end.toDate() >= startDate && event.end.toDate() <= endDate) {
                        count++;
                    }
                });
    //count - number of events on this day
}
ответил Alex 14 PMpTue, 14 Apr 2015 16:00:36 +030000Tuesday 2015, 16:00:36
0

Это то, что вам нужно для всех ваших событий на текущий день в другой функции:

            var date = $('.js-calendar').fullCalendar('getDate');
            date = date.toDate();
            var startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate(), 0, 0, 0);
            var endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate(), 23, 59, 59);
            var todaysEvents = $('.js-calendar').fullCalendar('clientEvents', function(event) {
                if (event.start.toDate() >= startDate && event.start.toDate() <= endDate
                    || event.end.toDate() >= startDate && event.end.toDate() <= endDate) {
                    return true
                }
            });
ответил derdida 25 thEurope/Moscowp30Europe/Moscow09bEurope/MoscowFri, 25 Sep 2015 11:43:30 +0300 2015, 11:43:30
0

Вы можете использовать библиотеку Moment. Например:

$('#endDate').val(moment(endDate).format('YYYY-MM-DD hh:mm:ss'));

http://momentjs.com/docs/#/displaying/format/

ответил Gabriel Zulian 23 Jam1000000amFri, 23 Jan 2015 07:06:56 +030015 2015, 07:06:56

Похожие вопросы

Популярные теги

security × 330linux × 316macos × 2827 × 268performance × 244command-line × 241sql-server × 235joomla-3.x × 222java × 189c++ × 186windows × 180cisco × 168bash × 158c# × 142gmail × 139arduino-uno × 139javascript × 134ssh × 133seo × 132mysql × 132