I'm using fullcalendar. I have a custom view, but I don't want users to be able to select a time range on this view.
selectable: true,
defaultView: 'multiColAgendaDay',
events: '/events.json',
views: {
multiColAgendaDay:
{
type: 'multiColAgenda',
duration: { days: 1 },
numColumns: gon.driver_num,
columnHeaders: gon.drivers_name,
buttonText: 'drivers'
// ,
}
},
I tried to solve this by adding a check in select
select: function (start, end, jsEvent, view) {
if (view.name === 'multiColAgendaDay'){
calendar.fullCalendar('unselect');
alert("You can create event in week and day view.");
return;
}
$.getScript('/events/new', function () {
$('#event_date_range').val(moment(start).format("MM/DD/YYYY HH:mm") + ' - ' + moment(end).format("MM/DD/YYYY HH:mm"))
date_range_picker();
$('.start_hidden').val(moment(start).format('YYYY-MM-DD HH:mm'));
$('.end_hidden').val(moment(end).format('YYYY-MM-DD HH:mm'));
});
calendar.fullCalendar('unselect');
},
I would like to know other approaches. I hope there is a way to set selectable to false in a specific view.
You can add selectable: false
to your view definition (the same way you add other properties to it). e.g.
multiColAgendaDay:
{
type: 'multiColAgenda',
duration: { days: 1 },
numColumns: gon.driver_num,
columnHeaders: gon.drivers_name,
buttonText: 'drivers',
selectable: false
}
When you're using this view, this overrides the top-level setting for selectable
. See https://fullcalendar.io/docs/v3/view-specific-options#v2 for documentation.
As long as you're using fullCalendar 2.4 or above, this should work.