Search code examples
mvvmkendo-uikendo-tooltip

Kendo tooltip for a button

The following code shows the title without kendo styles:

<button data-role="button" data-bind="click: add" data-position="top" class="k-button" title="Add">
        <i class="fa fa-file-o fa-2x"></i>
    </button>

while this code shows the title with kendo styles but without a calllout:

<button data-role="tooltip" data-bind="click: add" data-position="top" class="k-button" title="Add">
        <i class="fa fa-file-o fa-2x"></i>
    </button>

How can I show a kendo tooltip for a button with kendo styles and callout in MVVM way?

Solution

  • Since Kendo is using jQuery, You can use jquery click function.

    Set the ID for the button

     <button id="testbutton" data-role="tooltip" data-bind="click: add" data-position="top" class="k-button" title="Add">
            <i class="fa fa-file-o fa-2x"></i>
        </button>

    add click event handler

    $('#testbutton').click(function(){
    alert('xx');
});