angular-ui / ui-calendar

A complete AngularJS directive for the Arshaw FullCalendar.
http://angular-ui.github.io/ui-calendar/
MIT License
1.49k stars 728 forks source link

ui-calendar tooltip option is not working with bootstrap 3.1 #357

Open vrevanna opened 8 years ago

vrevanna commented 8 years ago

Am using using bootstrap 3.1 with eventRender to display tool tip its not working but it works with twitter bootstrap 2.3.

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

$scope.uiConfig = { eventRender: $scope.eventRender }

Please let me know the approach where i can use tool tip option with bootstrap 3.1

shreyashdholakia commented 8 years ago

@vrevanna i am having the same issue. Where you able to fix it and how?

Thanks!

vrevanna commented 8 years ago

Yes @shreyashdholakia .

Use $scope.eventMouseover = function (event, element, view) { ... }

It will work

mayson14 commented 8 years ago

do you have an example you could post? im trying to get this to work and not having much luck.

jeroensneyers commented 8 years ago

Try using uib-tooltip (and uib-tooltip-append-to-body) instead of just tooltip

mayson14 commented 8 years ago

Thank you very much for the reply.. That did get me closer.. it appears that my tooltips are being cut off by the date square on the calendar.. ive attached an image.

capture

dannymac7 commented 8 years ago

Thanks!!! Works well @jeroensneyers

dannymac7 commented 8 years ago

Also, this can be used for html tooltips element.attr({'uib-tooltip-html': "\'<p>yes</p>\'", 'uib-tooltip-append-to-body': true}); $compile(element)($scope); }; @mayson14

interman commented 7 years ago

It still not work for me when i using uib-tooltip (and uib-tooltip-append-to-body. I am using bootstrap 3.3.7 and angular-bootstrap 2.1.3.

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

Anyone can send me a sample code how to fix the tooltip problem?

qwq-qwq commented 7 years ago

Works ! bootstrap 3.3.4 and angular-bootstrap 2.2.0

$scope.eventRender = function( event, element, view){
    element.attr({'uib-tooltip-html': "\'<p>" + event.title + "</p>\'", 'tooltip-append-to-body': true}); $compile(element)($scope);
};
crediblebytes commented 7 years ago

image

Important to point out that the correct attribute is tooltip-append-to-body and not uib-tooltip-append-to-body. But still use uib-tooltip-html. Frustrating I know. They really need to rename that attribute to include uib like every other directive.