jQuery UI Widgets › Forums › Dialogs and Notifications › Tooltip, Notification, Popover › jqxangular tooltip issue
Tagged: Angular tooltip, bootstrap tooltip, javascript tooltip, jQuery Tooltip, jqwidgets tooltip, jqxTooltip, tooltip angularjs jqxangular
This topic contains 1 reply, has 2 voices, and was last updated by Hristo 9 years, 1 month ago.
-
Authorjqxangular tooltip issue Posts
-
Hi There,
I tried to implement jqxangular tooltip feature shown in example, but i am facing some issues:
1: scope variable containing Tooltip content not rendering inside jqx-tooltip directive.
2: position of tooltip is always at the end of div / span, not on location of mouse.i might be missing something, which i cant figure out. please look into it.
code:
<!DOCTYPE html>
<html ng-app=”demoApp”>
<head>
<title id=’Description’>jqxTooltip Directive for AngularJS.</title>
<link rel=”stylesheet” href=”jqx.base.css” type=”text/css” />
<script type=”text/javascript” src=”angular.min.js”></script>
<script type=”text/javascript” src=”jquery-1.11.3.js”></script><script type=”text/javascript” src=”jqxcore.js”></script>
<script type=”text/javascript” src=”jqxbuttons.js”></script>
<script type=”text/javascript” src=”jqxtooltip.js”></script>
<script type=”text/javascript” src=”jqxangular.js”></script>
<script type=”text/javascript”>
var demoApp = angular.module(“demoApp”, [“jqwidgets”]);
demoApp.controller(“demoController”, function ($scope) {
$scope.toolTipContent = “The Amazing Spider-man”;
// cancel button click handler.
$scope.changeTooltip = function () {
$scope.toolTipContent = “The Amazing Spider-man 2″;
}
});
</script>
</head>
<body class=’default’>
<div ng-controller=”demoController”>
<div> content of tooltip: {{toolTipContent}}</div>
<jqx-tooltip jqx-position=”‘mouse'” jqx-content=”‘toolTipContent'”>
<span> JQX TOOl TOOL TIP TRIAL </span>
</jqx-tooltip>
<br /><br />
<jqx-button ng-click=”changeTooltip()”>Change Tooltip Content</jqx-button>
</div>
</body>
</html>Thanks,
BipinHello Bipin,
There are quotes more.
Correct –<jqx-tooltip jqx-position="'mouse'" jqx-content="toolTipContent">
instead – jqx-content=”‘toolTipContent‘”
And if you change <span> tag with sometag the position of tooltip will follow mouse.
Everything else is ok.Best Regards,
Hristo HristovjQWidgets team
http://www.jqwidgets.com -
AuthorPosts
You must be logged in to reply to this topic.