I am integrating fullcalendar with Rails. I can insert events and see them in the "month" view, but I do not see the week and day views.
this is my js:
$(document).ready(function(){
$('#calendar').fullCalendar({
monthNames: ['Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre'],
monthNamesShort: ['Ene','Feb','Mar','Abr','May','Jun','Jul','Ago','Sep','Oct','Nov','Dic'],
header: {
left: 'prev, next, today',
center: 'title',
right: 'month, agendaWeek, agendaDay'
},
//defaultView: 'agendaWeek',
minTime: "10:00:00",
maxTime: "23:30:00",
height: 'auto',
hiddenDays: [0, 6],
slotDuration:"00:20:00",
timezone: 'local',
allDaySlot: false,
businessHours: {
// days of week. an array of zero-based day of week integers (0=Sunday)
dow: [ 1, 2, 3, 4, 5 ], // Monday - Thursday
start: '10:00', // a start time (10am in this example)
end: '23:30', // an end time (6pm in this example)
},
// Get all events stored in database
eventLimit: true, // allow "more" link when too many events
events: <%= @events.to_json.html_safe %>,
selectable: true,
selectHelper: true,
editable: true, // Make the event resizable true,
select: function(start, end) {
if(start.isBefore(moment())) {
$('#calendar').fullCalendar('unselect');
return false;
}
$('#modalNew').modal('show');
$('#txtIni').val(moment(start).format('DD-MM-YYYY h:mm:ss'));
$('#txtFin').val(moment(end).format('DD-MM-YYYY h:mm:ss'));
$.getScript('/events/new', function() {});
//alert(moment(start).format('h:mm:ss a'));
},
// Handle Existing Event Click
eventClick: function(calEvent, jsEvent, view) {
// Set currentEvent variable according to the event clicked in the calendar
currentEvent = calEvent;
// Open modal to edit or delete event
modal({
// Available buttons when editing
buttons: {
delete: {
id: 'delete-event',
css: 'btn-danger',
label: 'Delete'
},
update: {
id: 'update-event',
css: 'btn-success',
label: 'Update'
}
},
title: 'Edit Event "' + calEvent.title + '"',
event: calEvent
});
}
});
// Handle Click on Add Button
$('.modal').on('click', '#add-event', function(e){
if(validator(['title', 'description'])) {
$.post(base_url+'calendar/addEvent', {
title: $('#title').val(),
description: $('#description').val(),
color: $('#color').val(),
start: $('#start').val(),
end: $('#end').val()
}, function(result){
$('.alert').addClass('alert-success').text('Event added successfuly');
$('.modal').modal('hide');
$('#calendar').fullCalendar("refetchEvents");
hide_notify();
});
}
});
// Prepares the modal window according to data passed
function modal(data) {
// Set modal title
$('.modal-title').html(data.title);
// Clear buttons except Cancel
$('.modal-footer button:not(".btn-default")').remove();
// Set input values
$('#title').val(data.event ? data.event.title : '');
$('#description').val(data.event ? data.event.description : '');
$('#color').val(data.event ? data.event.color : '#3a87ad');
// Create Butttons
$.each(data.buttons, function(index, button){
$('.modal-footer').prepend('<button type="button" id="' + button.id + '" class="btn ' + button.css + '">' + button.label + '</button>')
})
//Show Modal
$('.modal').modal('show');
}
$('#btnOK').on('click',function(){
var evento = $('#txtPaciente').val();
var ini = $('#txtIni').val();
var fin = $('#txtFin').val();
$.ajax({
type: 'POST',
url: '/events/',
data: {event : {title: evento,start: ini,end: fin}},
success: function(){
console.log('Datos guardados');
},
error: function(){
console.log('error ajax');
}
});
console.log(evento+' '+ini+' '+fin);
});
});
in the bd the events are created in datetime format. How do I see the events in the AgendaWeek views, and agendaDay in the cells of their respective hours?