Wijmo UI for the Web
KO Tooltip Binding
Wijmo User Guide > Concepts > Integrating Frameworks > Knockout > Two-Way Live Binding > KO Tooltip Binding

Data-binding options:

Example:

In this example, the ViewModel is defined specifically for use with the tooltip. It has disabled, closeBehavior, triggers, mouseTrailing, showCallout, calloutFilled, modal, showDelay, and hideDelay properties that are bound in the View. If any of these values change, the widgets automatically respond to them. The widgets also update the ViewModel values as they modify them.

Create a ViewModel:

ViewModel Script
Copy Code
var viewModel = function () {     
     var self = this;
     self.disabled = ko.observable(false);         
     self.closeBehavior = ko.observable('auto');         
     self.triggers = ko.observable('hover');         
     self.mouseTrailing = ko.observable(true);         
     self.showCallout = ko.observable(true);         
     self.calloutFilled = ko.observable(true);         
     self.modal = ko.observable(false);         
     self.showDelay = ko.observable(150);         
     self.hideDelay = ko.observable(150);
};

Create View with Bound Controls:

View Markup
Copy Code
<div style="width: 100px; height: 50px; background-color: red;" title="tooltip" data-bind="wijtooltip: {
    disabled: disabled, 
    closeBehavior: closeBehavior, 
    mouseTrailing: mouseTrailing, 
    triggers: triggers, 
    showCallout: showCallout, 
    showDelay: showDelay, 
    hideDelay: hideDelay, 
    calloutFilled: calloutFilled, 
    modal: modal}">show tooltip</div>
See Also

Widgets

Concepts

Reference