This is a migrated thread and some comments may be shown as answers.

Extending MultiSelect widget broken since 2017?

1 Answer 122 Views
MultiSelect
This is a migrated thread and some comments may be shown as answers.
Pieter
Top achievements
Rank 1
Pieter asked on 02 Aug 2017, 08:01 AM

Hi,

I once created a custom widget which extended the Multiselect widget (using Kendo 2016.2.714), but once I switch to Kendo 2017 (.1 or .2, doesn't matter), the widget is broken and gives a javascript error ("TypeError: Cannot read property 'done' of undefined"). For the purpose of this post, I created a really simple widget, showing the issue:

kendo.ui.plugin(kendo.ui.MultiSelect.extend({
    init: function (element, options) {
        kendo.ui.MultiSelect.fn.init.call(this, element, options);
    },
    options: {
        name: 'MultiSelectCustom'
    },
    _select: function(e) {
        console.log(e);
    }
}));
 
kendo.data.binders.widget.multiselectcustom = kendo.data.binders.widget.multiselect;

 

The issue seems to be in the override of the "select" function, when I remove that, no JavaScript errors are to be seen.

How to get this to work again with Kendo 2017?

Regards,
Pieter

1 Answer, 1 is accepted

Sort by
0
Dimitar
Telerik team
answered on 04 Aug 2017, 06:48 AM
Hello Pieter,

On the following Dojo example you will find a simple MultiSelect implementation, where a similar scenario to the one described is demonstrated (Extending/overriding the Kendo UI MultiSelect _select function).

The observed behavior is expected, as this function expects a deferred object to be resolved ($.Deferred). There are two possible options:

1) Perform custom logic and then call the base function (as demonstrated in the Dojo):
return kendo.ui.MultiSelect.fn._select.call(this, candidate);

2) Override the function and provide your own custom implementation:
_select: function(candidate) {  
  // Create a deferred object
  var dfd  = $.Deferred();
          
  // Add handlers to be called when dfd is resolved
  dfd.done(function() {
    console.log("dfd resolved");
  });
          
  // Resolve the Deferred object
 return dfd.resolve();          
}


Regards,
Dimitar
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
MultiSelect
Asked by
Pieter
Top achievements
Rank 1
Answers by
Dimitar
Telerik team
Share this question
or