How to extend the kendoListView widget

[Phil H.]

Hi:

I would like to add my own methods on the to ListView as follows:

$("#AlertListView").kendoListView({
     dataSource: {
        data: []
    },
    template: "<li>#: message #</li>",
    displayMessages: function( messages ) {
        ...
    },
    hideMessages: function( ) {
        ...
    }
});

Phil

[Alexander Valchev]

Hi Phil,

Please check this tutorial as it explains how to extend/create Kendo UI widgets.
I would like to point out that assistance related to creating custom widget or extending the build-in functionality of the existing ones is out of the scope of our support services.

Regards,
Alexander Valchev
Telerik

 

 

[Phil H.]

Hi:

I was already familiar with that page.  That addresses building a widget from the Widget class.  I am working with the ListView and would like to extent it.  Before I posted, I was unable to extend ListView, I am getting object does not support method 'extend'.  I would guess that all kendo objects use Widget as the prototype, so it should support extend method.

Phil

[Alexander Valchev]

Hello Phil,

I prepared a small example that demonstrates how to extend (add methods to) an existing widget.

• http://trykendoui.telerik.com/@Alexander/EsAN

The approach uses extend method of the widget:

(function ($) {
  var CustomListView = kendo.ui.ListView.extend({
    options: {
        name: "CustomListView"
    },
    say: function(message) {
        console.log(message);
    }
  });
  kendo.ui.plugin(CustomListView);
})(jQuery);

I hope this will help.

Regards,
Alexander Valchev
Telerik