A Tooltip displays popup hint for a given html element. Its content can be defined either as static text or loaded dynamically via AJAX.
This example demonstrates passing basic options to the Tooltip plugin.
<div data-bind="kendoTooltip: { content: tipText }">
Tooltip Content
</div>
var ViewModel = function() {
this.tipText = "I am a tooltip!";
};
ko.applyBindings(new ViewModel());
This example demonstrates using the filter configuration option.
<div data-bind="kendoTooltip: { filter: tipFilter }">
Some <a href="#" title="Some text">Content</a><br />
Some <a href="#" title="Some other text">More</a> Content <br />
</div>
var ViewModel = function() {
this.tipFilter = "a[title]";
};
ko.applyBindings(new ViewModel());
This example demonstrates setting global options in ko.bindingHandlers.kendoTooltip.options. This helps to simplify the markup for settings that can be used as a default for all instances of this widget.
<div data-bind="kendoTooltip: { content: tipText }">
Tooltip Content
</div>
var ViewModel = function() {
this.tipText = "I am a tooltip!";
};
ko.bindingHandlers.kendoTooltip.options = {
autoHide: false,
callout: true,
height: 50,
width: 250,
position: "left"
};
ko.applyBindings(new ViewModel());