Fullcalendar v4: addEvent () не работает в пользовательском представлении - PullRequest
Новая
       11

Fullcalendar v4: addEvent () не работает в пользовательском представлении

0 голосов
/ 01 апреля 2020

Я использую fullcalendar v4 (https://fullcalendar.io/) и пытаюсь обновить sh событие сброса в пользовательском представлении 'timeGridSixMonth'. 

var calendar = new FullCalendar.Calendar(calendarEl, {
                plugins: [ 'bootstrap', 'interaction', 'dayGrid', 'timeGrid', 'list' ],
                defaultView: 'timeGridSixMonth',
                header: {
                    left: 'prev,next today',
                    center: 'title',
                    right: 'timeGridSixMonth,timeGridWeek,timeGridDay,listSixMonth'
                },
                buttonText: {
                    timeGridSixMonth: '6 Month',
                    listSixMonth: 'List 6 Month'
                },
                views: {
                        timeGridSixMonth: {
                        type: 'dayGrid',
                        duration: { month: 6 },
                        titleFormat: { year: 'numeric', month: 'short', day: 'numeric' },
                    },
                        listSixMonth: {
                        type: 'listMonth',
                        duration: { month: 6 },
                        titleFormat: { year: 'numeric', month: 'short', day: 'numeric' } 
                    }
},

.. ... 

drop: function(info) {

                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    }
                });

                console.log(info);

                $.ajax({
                    url: '/api/plan',
                    type: "POST",
                    data: {
                        'title':          info.jsEvent.explicitOriginalTarget.textContent
                        'item_id':        $('#item_id').children("option:selected"). val(),
                        'start':          start,
                        'end':            end,
                        'users_id':{{ \Illuminate\Support\Facades\Auth ::user() -> id }},
                     },
                    success: function (response) {

                        console.log(response);
                        calendar.addEvent({
                            title:  response.data.title,
                            start:  response.data.start,
                            end:    response.data.end,
                            allDay: false,
                            id:     response.data.id,
                        });
                        displayMessage('gespeichert.');
                    }
                });
            },

Ответ: 

{
  "success": true,
  "data": {
    "Fach": "Rhetorik",
    "faecher_id": 22,
    "dozenten_id": 112,
    "schulungsorte_id": 18,
    "Beginn": "2020-10-29T16:00:00.000000Z",
    "Ende": "2020-10-29T20:00:00.000000Z",
    "kurstermine_id": "14,17,7,21",
    "users_id": 3,
    "updated_at": "2020-04-01T16:15:34.000000Z",
    "created_at": "2020-04-01T16:15:34.000000Z",
    "id": 26,
    "title": "Rhetorik\n        Mr. Miller",
    "start": "2020-10-29T16:00:00.000000Z",
    "end": "2020-10-29T20:00:00.000000Z"
  },
  "message": "stored."
}

В пользовательском представлении создается событие без идентификатора, а addEvent () не работает.

В стандартных представлениях я получаю повторяющееся событие без идентификатора.

Вы догадываетесь, почему?

1 Ответ

1 голос
/ 02 апреля 2020

решено:

Я использовал eventReceive вместо drop: 

eventReceive: function(info) {

       console.log('eventReceive', info);

       var starttime   = moment(info.event._instance.range.start).utcOffset(0).format("YYYY-MM-DD HH:mm:ss");
       var endtime     = moment(info.event._instance.range.start).utcOffset(0).format("YYYY-MM-DD HH:mm:ss");

                        $.ajaxSetup({
                            headers: {
                                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                            }
                        });

                        console.log(info);

                        $.ajax({
                            url: '/api/plan',
                            type: "POST",
                            data: {
                                'title':            info.draggedEl.innerText,
                                'item_id':      info.draggedEl.dataset.event,
                                'start':          starttime,
                                'end':            endtime,
                                'users_id':{{ \Illuminate\Support\Facades\Auth ::user() -> id }},
                            },
                            success: function (response) {

                                console.log(response);
                                info.event.setProp('title', response.data.title);
                                info.event.setProp('id', response.data.id);
                                info.event.setProp('start', response.data.start);
                                info.event.setProp('end', response.data.end);
                            }
                        });
                    },
...