ui-calendar icon indicating copy to clipboard operation
ui-calendar copied to clipboard

How to show display event information with mouseover (i.e. hovering a day on the calendar)?

Open Hiroki111 opened this issue 8 years ago • 3 comments

On the demo, it can be seen that the event name will be popped up when the day is hovered. So, it should be possible to display the event name with mouseover, but I can't find how to do this from the list of issues. (I thought it could be achieved by adding a property in $scope.uiConfig and make the corresponding function.)

Could anyone give any hint?

Hiroki111 avatar Oct 12 '16 07:10 Hiroki111

By the way, my uiConfig looks like this now.

$scope.uiConfig = { calendar: { viewRender: function (view) { //some statements here }, renderCalender: $scope.renderCalender, height: 520, editable: true, header: { left: 'month basicWeek basicDay agendaWeek agendaDay', center: 'title', right: 'today prev,next' }, eventClick: $scope.alertOnEventClick, dayClick: $scope.alertDayOnClick, eventDrop: $scope.alertOnDrop, eventResize: $scope.alertOnResize, eventRender: $scope.eventRender } };

Hiroki111 avatar Oct 12 '16 07:10 Hiroki111

It's tooltip

    $scope.eventRender = function( event, element, view ) { 
        element.attr({
             'tooltip': event.title,
             'tooltip-append-to-body': true});
        $compile(element)($scope);
    };

kxgio avatar Nov 22 '16 23:11 kxgio

@kxgio After using your code, I am getting following error.

ReferenceError: $compile is not defined

SriAstitva avatar May 04 '17 06:05 SriAstitva