fullcalendar

Remove past dates and next months dates from the current month

早过忘川 提交于 2019-12-01 02:52:19
Is it possible to remove the past dates and next month's dates from the fullcalendar? So for the current month it should display only current dates and days. You could try skipping the events in the eventRender() method: eventRender: function(event, element, view) { if(event.start.getMonth() !== view.start.getMonth()) { return false; } } The grid cells for the next and previous month have the class "fc-other-month", so you can target them that way: e.g.: The hide the day numbers, add the CSS: .fc-other-month .fc-day-number { display:none;} or run this JavaScript: $(".fc-other-month .fc-day

Using FullCalendar methods with AngularUI wrapper

南笙酒味 提交于 2019-12-01 01:59:15
I'm trying to integrate AngularUI's calendar wrapper into my application, and the calendar initialization works fine. However, I don't see how I can call calendar methods from here. Here's my controller code: $scope.events = []; $scope.calendarOptions = { calendar: { header: { left: 'prev,next today', center: 'title', right: 'month,agendaWeek,agendaDay' }, defaultView: 'agendaWeek', selectable: true, selectHelper: true, select: function(start, end, allDay) { var title = prompt('Event Title:'); if (title) { $scope.$apply(function(){ $scope.events.push({ title: title, start: start, end: end,

FullCalendar Change Week View to Vertical List instead of Horizontal Table Columns

£可爱£侵袭症+ 提交于 2019-12-01 00:39:45
Anyway to change the way the Days show in the Week View? I'd rather see a vertical list of the vents by day instead of the horizontal table view of the days. reasoning is it looks pretty bad when on mobile devices and any devices with small width screens... If the only way to do this is through modifying the underlying code, where in the code creates the table content for the Week view? If I figure out where that is, I could probably modify it to display as a list instead of a table... UPDATE: I expanded on the below and came up with a better solution, with labels for each day. Here's an

fullcalendar add events dynamically

无人久伴 提交于 2019-12-01 00:11:17
问题 I'm trying to create events in my full calendar dynamically. I have: $('#calendar').fullCalendar({ viewRender: function (view) { var h; if (view.name == "month") { h = NaN; } else { h = 2500; // high enough to avoid scrollbars } $('#calendar').fullCalendar('option', 'contentHeight', h); }, lang: 'fr', events: [ { title: '8 présents', start: data[0] }, { title: '8 excusés', start: data[1] }, { title: '8 excusés', start: '2015-01-08' }, { title: '8 présents', start: '2015-01-08' }, ], dayClick:

FullCalendar - Event spanning all day are one day too short

假如想象 提交于 2019-11-30 23:16:23
问题 I'm passing to fullcalendar an event like this one: { id: 31, title: 'Test', start: '2014-12-22', end: '2014-12-23', allDay: true } I expected to find in the calendar an event that spans two whole days, but the event is only in the 2014-12-22 slot, not in the 2014-12-23 one. The nextDayThreshold parameter is set to 00:00:00 , but according to the documentation it should be ignored when allDay is set to true. I'm sure that allDay is correctly interpreted because in the agenda view the event

jQuery fullCalendar and qTip

安稳与你 提交于 2019-11-30 22:29:32
I'm looking at using fullCalendar and using qTip to display a description using eventMouseover. Has anyone managed to do this or know of a solution? I've google'd and also tried implementing this post but i've had no joy. The only time I got it to work it got into a loop and crashed my browser. Any advice / support would be greatly appreciated. Von Schmytt. UPDATED: Here's the code i'm starting off with (aware it's an example script but, if I could get qTip integrated I could progress). I have qTip, etc ready to use. I just don't know where to start with this now? Thanks again. UPDATED: 15th

FullCalendar.js: Preventing selections other than on background events? [closed]

为君一笑 提交于 2019-11-30 21:38:47
问题 Closed . This question needs details or clarity. It is not currently accepting answers. Want to improve this question? Add details and clarify the problem by editing this post. Closed 4 years ago . How do I prevent the user from selecting non-colored areas (background events). He should only be able to select the blue-colored areas. 回答1: Until this request that I made a bit ago is finished, the best solution is this: Use the following function to check if an event is "inside" of a background

Fullcalendar (Arshaw) - Adding an event with modal window

给你一囗甜甜゛ 提交于 2019-11-30 20:58:32
问题 I am working on arshaw calendar and I am really new to this. I want to be able to add event VIA modal window. Here are the screenshots of what I'm trying to do: In the image above, is my (Arshaw)Fullcalendar. The second image shows that when the user clicked on the calendar, say at 6am, the modal pops up and the user will now be able to add the event via modal. Here is my code: Javascript: //arshaw calendars $(document).ready(function () { // page is now ready, initialize the calendar... $('

Using FullCalendar methods with AngularUI wrapper

╄→гoц情女王★ 提交于 2019-11-30 20:32:24
问题 I'm trying to integrate AngularUI's calendar wrapper into my application, and the calendar initialization works fine. However, I don't see how I can call calendar methods from here. Here's my controller code: $scope.events = []; $scope.calendarOptions = { calendar: { header: { left: 'prev,next today', center: 'title', right: 'month,agendaWeek,agendaDay' }, defaultView: 'agendaWeek', selectable: true, selectHelper: true, select: function(start, end, allDay) { var title = prompt('Event Title:')

FullCalendar v.2.2.6 'hasTime' undefined error when using addEventSource

谁说我不能喝 提交于 2019-11-30 18:54:15
I'm currently trying to test out FullCalendar (version 2.2.6) addEventSource $('button').click(function() { $("#calendar").fullCalendar('removeEventSource', cal_events_1); $("#calendar").fullCalendar('addEventSource', cal_events_2); }); but I'm always getting this error: Uncaught TypeError: Cannot read property 'hasTime' of undefined Both sources are hard coded and loading the calendar with either source loads the events successfully, so no date is incorrect. var cal_events_1 = [ { events: [ { title: 'event 1', start: '2015-01-04', color: 'tomato' }, { title: 'event 2', start: '2015-01-09' }],