javascript - external events based on defined event data -
i think missing something, problem using fullcalendar drag , drop when drag 1 of external events, wanna fit defined start , end object have associated using html5 data-event
. how make possible? need favor.
below html code external events
<div class='fc-event' data-event='{"start": "{{ $shift->shiftdetail->in_monday }}","end": "{{ $shift->shiftdetail->out_monday }}","id": "{{ $shift->id }}" }'>{{ $shift->name }}</div>
and below fullcalendar javascript.
var arrayofevents = []; $('#calendarsetting').fullcalendar({ now: moment(), editable: true, // enable draggable events droppable: true, // allows things dropped onto calendar aspectratio: 1.8, scrolltime: '00:00', // undo default 6am scrolltime lazyfetching: false, starteditable: true, header: { left: 'today', center: 'title', right: 'agendaday' }, defaultview: 'agendaday', views: { day: { type: 'agenda', duration:true } }, resourcelabeltext: 'days', resources:{!! $temp_shift !!}, events: arrayofevents, drop: function(date, jsevent, ui, resourceid) { // "remove after drop" checkbox checked? if ($('#drop-remove').is(':checked')) { // if so, remove element "draggable events" list $(this).remove(); } }, eventreceive: function(event) { // called when proper external event dropped console.log($("#calendarsetting").fullcalendar('clientevents')); }, eventdrop: function(event, daydelta, revertfunc, jsevent, ui, view) { console.log('eventdrop', event); } });
Comments
Post a Comment