全日历删除仅在特定资源组或资源ID上删除

时间:2019-08-07 06:32:12

标签: javascript jquery fullcalendar fullcalendar-scheduler fullcalendar-4

我想使全日历事件不使用特定资源进行拖放。

event-fullcalendar

例如下面的代码Resource C and Resource G,我可以拖放事件。 我想使事件不可拖动到Resource C and Resource G

评论以获取更多信息。

document.addEventListener('DOMContentLoaded', function() {
  var calendarEl = document.getElementById('calendar');

  var calendar = new FullCalendar.Calendar(calendarEl, {
    timeZone: 'UTC',
    plugins: [ 'interaction', 'resourceTimeline' ],
    header: {
      left: 'promptResource today prev,next',
      center: 'title',
      right: 'resourceTimelineDay,resourceTimelineWeek'
    },
    aspectRatio: 1.5,
    defaultView: 'resourceTimelineDay',
    resourceLabelText: 'Rooms',
	editable: true,
    resources: [{"id":"a","title":"Auditorium A"},{"id":"b","title":"Auditorium B"},
	{"id":"c","title":"Auditorium C"},
	{"id":"d","title":"Auditorium D","children":[{"id":"d1","title":"Room D1"},
	{"id":"d2","title":"Room D2"}]},
	{"id":"e","title":"Auditorium E"},
	{"id":"f","title":"Auditorium F"},
	{"id":"g","title":"Auditorium G"},
	{"id":"h","title":"Auditorium H"},
	{"id":"i","title":"Auditorium I"}],
	events: [{"resourceId":"d","title":"event 1","start":"2019-08-04","end":"2019-08-06"},
	{"resourceId":"c","title":"event 3","start":"2019-08-05T12:00:00+00:00","end":"2019-08-06T06:00:00+00:00"},
	{"resourceId":"f","title":"event 4","start":"2019-08-05T07:30:00+00:00","end":"2019-08-05T09:30:00+00:00"},
	{"resourceId":"b","title":"event 5","start":"2019-08-05T10:00:00+00:00","end":"2019-08-05T15:00:00+00:00"},
	{"resourceId":"e","title":"event 2","start":"2019-08-05T09:00:00+00:00","end":"2019-08-05T14:00:00+00:00"}]
  });

  calendar.render();
});
#calendar {
  max-width: 900px;
  margin: 40px auto;
}
<link href="https://fullcalendar.io/releases/core/4.2.0/main.min.css" rel="stylesheet"/>
<link href="https://fullcalendar.io/releases/timeline/4.2.0/main.min.css" rel="stylesheet"/>
<link href="https://fullcalendar.io/releases/resource-timeline/4.2.0/main.min.css" rel="stylesheet"/>
<script src="https://fullcalendar.io/releases/core/4.2.0/main.min.js"></script>
<script src="https://fullcalendar.io/releases/interaction/4.2.0/main.min.js"></script>
<script src="https://fullcalendar.io/releases/timeline/4.2.0/main.min.js"></script>
<script src="https://fullcalendar.io/releases/resource-common/4.2.0/main.min.js"></script>
<script src="https://fullcalendar.io/releases/resource-timeline/4.2.0/main.min.js"></script>


<div id="calendar"></div>

0 个答案:

没有答案