We Keep Coding

Fullcalendar How do I change date format to UK calendar format

I'm using FullCalendar v3.5.1 plugin which uses US calendar format by default. How could I change it to UK format dd/mm/yyyy.
$('#calender').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,basicWeek,basicDay'
},
defaultView: 'basicWeek',
events: function(start, end, timezone, callback) {
}
});

You want to set the locale as 'en-gb' like as follows.
Here is a jsfiddle working. You also need to retrieve https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.0.0/locale-all.js
If you look at resources on the left you can see what libraries you need.
Below you can see the code you need.
...
$('#calender').fullCalendar({
locale: 'en-gb',
header: {
left: 'prev,next today',
center: 'title',
right: 'month,basicWeek,basicDay'
},
defaultView: 'basicWeek',
events: function(start, end, timezone, callback) {
}
});

Cannot read property 'datepickerLocale' of undefined

This may be a specific issue but I am stuck after quite some debugging done. Maybe a fresh pair of eyes would see something I am missing. I have posted only the relevant code snippets, as it is a bigger app.
Everything works fine, however I keep getting this error and I don't exactly know what would be causing it and how it could affect the code.
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
defaultView: 'agendaDay',
defaultTimedEventDuration: '00:10:00',
locale: 'ro',
timeFormat:'H:mm',
slotLabelFormat:"HH:mm",
axisFormat: 'H:mm',
navLinks: true,
selectable: true,
selectHelper: true,
allDaySlot: false,
eventClick: function(calEvent, jsEvent, view) {
editEvent(calEvent);
},
eventLimit: true // allow "more" link when too many events
});
console.log('The right one');
$("#starts-at").datetimepicker({
minDate: new Date(),
locale: 'ro'
});
$("#starts-at-edited").datetimepicker({
minDate: new Date(),
locale: 'ro'
});
<script src='vendor/jquery.min.js'></script>
<script src='vendor/bootstrap.min.js'></script>
<script src='vendor/moment.min.js'></script>
<script src='vendor/fullcalendar.js'></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>
<script src='vendor/locale/ro.js'></script>
<script src='calendar.js'></script>

Change agenda hour from 6 am to 6 am tomorrow

I am trying to set FullCalendar so it shows hours from 6am to 6am the next day. I can set minTime=6, but what should I put as maxTime? Thanks!
This is the full code:
<script>
$(document).ready(function() {
$.ajax({
url: "/getfullcalendar",
cache: false
})
.done(function( retevents ) {
var retevents = retevents;
$('#fullcalendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaDay,listWeek',
},
firstDay: 1,
defaultView: 'agendaDay',
navLinks: true,
minTime: "06:00:00",
// What to put here
// for the same time tomorrow (6am)?
maxTime: "24:00:00",
height: 'auto',
events: retevents,
});
});
});
</script>

maxTime: "30:00:00"
24 hours + 6 hours for the next day

It looks like you can use the
allDaySlot: true
option. https://fullcalendar.io/docs/agenda/allDaySlot/

Split day agenda in full calendar into 15-minute slots

$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
buttonText: {
today: 'today',
month: 'month',
week: 'week',
day: 'day'
},
//Random default events
events : <?php echo json_encode($events1);?>,
editable: true,
droppable: true, // this allows things to be dropped onto the calendar !!!
drop: function (date, allDay) { // this function is called when something is dropped
i need to split into 15 minutes interval.the default is 30 minutes slots.how can i achieve it thank u in advance

I think you're looking for slotDuration: http://fullcalendar.io/docs/agenda/slotDuration/

fullcalendar set slotDuration not working

i have a calendar working with the following code:
$( document).ready( function(){
$('#calendar').fullCalendar( {
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay' },
editable: true,
slotDuration: '00:15:00',
defaultView: 'agendaWeek',
eventLimit: true,
events: source
}
)}
Following this flddle, i tried to set the slotDuration to 15 min, but it's not working. It just uses the default 30 min.
The only hint i get is this error when i open the calendar on Chrome:
Failed to get text for stylesheet 37: No style sheet with given id found
Any idea of which might be the problem?