Search Posts

Category: fullcalendar

how to show agendaday with rowspan dynamically

I can’t get any CSS that change the specific column header with title when event loader: function initCalendar(myresources) { $(‘#day-calendar’).fullCalendar({ defaultView: ‘agendaDay’, // defaultDate: ‘2017-12-28’, defaultDate: $scope.setDate, aspectRatio: 1.8, editable: true, selectable: true, eventLimit: true, slotEventOverlap: true, minTime: $scope.lessonStartTime, maxTime: $scope.lessonEndTime, contentHeight: ‘auto’, slotLabelInterval: $scope.lessonTimeInterval, slotLabelFormat: “HH:mm:A”, header: { left: ”, center: ‘Time’, right: ” }, views: { agendaDay: { groupByDateAndResource: true, } }, selectable: true, selectHelper: true, resourceLabelText: “Venue”, allDaySlot: false, resources: myresources, events: […]

How to update event source object to particular event source in full calendar dynamically

Hello I have loaded one calendar using below code. dataFactory.httpRequest(‘getCalanderTaskData’,’GET’).then(function(data) { $scope.taskCalanderDailyTask = data.dailyTask; $scope.taskCalanderDueTask = data.dueTask; $scope.fullCalendarEventSources = { dailyTask : { events:$scope.taskCalanderDailyTask, textColor : ‘#000’, backgroundColor: ‘#FFD000’, }, dueTask : { events:$scope.taskCalanderDueTask, textColor : ‘#fff’, backgroundColor: ‘#da1445’, } }; $(‘#fullcalendar’).fullCalendar({ eventClick: function(calEvent, jsEvent, view) { }, eventMouseover: function(calEvent, jsEvent, view) { var tooltip = ‘<div class=”tooltipevent” style=”color:#fff;width:100px;height:50px;background:#125688;position:absolute;z-index:10001;”>’ + calEvent.title + ‘</div>’; var $tooltip = $(tooltip).appendTo(‘body’); $(this).mouseover(function(e) { $(this).css(‘z-index’, 10000); $tooltip.fadeIn(‘500′); $tooltip.fadeTo(’10’, 1.9); }).mousemove(function(e) […]

angular.js ui-calendar: using prev/next methods with external buttons

I’m using ui-calendar directive. I want to use external buttons for prev and next buttons like this: $(‘#my-prev-button’).click(function() { $(‘#calendar’).fullCalendar(‘prev’); }); $(‘#my-next-button’).click(function() { $(‘#calendar’).fullCalendar(‘next’); }); I expect these buttons to navigate one month up or down, but when I click on they, multiple clicks are thrown, resulting in moving two months (sometimes more) away instead of one. To make work this code I placed it inside the viewRender function, which I suspect is the cause […]

update values in jquery based on angular change

In my application I have used calendar widget using fullcalender.js, $(document).ready(function() { $(‘#profile-calendar’).fullCalendar({ events: $scope.calendarEvent }); }); what I wanted to do is, I need to give different values to the event attribute based a angular event. the below code snippet is what I have used to update the $scope.calendarEvent attribute. $scope.$on(‘profile_selection’,function(event, args){ $scope.calendarEvent = $rootScope.calendarEvent; $scope.$apply(); }); But this is not working as I expected, the calendar is showing the initial value given to […]

‘FullCalendar" can’t adjust time lower than 30 minutes

I am working on the Schedule in PrimeNG : I am facing the issue how to add time to the Schedule. I see that it only can add date to the Schedule and adjust the time more than 30 minutes. It can’t adjust the duration time lower than 30 minutes. I am using Angular 2 technology in my app. Do you have any ideas for my case ? I want to create the Schedule […]

jquery : Subsequent variable declarations must have the same type. Variable ‘jQuery’ must be of type ‘any’, but here has type ‘JQueryStatic’

I installed ng2-fullcalendar calendar in my angualar project. But am getting an error in, path/node_modules/@types/jquery/index.d.ts error message is Subsequent variable declarations must have the same type. Variable ‘jQuery’ must be of type ‘any’, but here has type ‘JQueryStatic’. declare module “jquery” { export = $; } declare var jQuery: JQueryStatic; declare var $: JQueryStatic; When I changed “JQueryStatic” to “any” it works. Since the change is in node_modules directory I cannot make the change for […]