Extend Kendo MultiSelect

南楼画角 提交于 2019-12-24 18:57:13

问题


I'm trying to create a new kendo multi-select widget by extending the existing one. The goal is to show the tag list in a div below the input.

My goal here in this code is to render the tag list in a separate div on the select event of the widget, and then return the select event of the base widget (Kendo MultiSelect), but the select event of the base widget returns a dataItem undefind error. What am I doing wrong?

(function ($) {
    var customMultiSelect = kendo.ui.MultiSelect.extend({
        init: function (element, options) {
            var that = this;
            kendo.ui.MultiSelect.fn.init.call(that, element, options);

            // Hide the tag list...
            var id = that.element.attr('id');
            that.wrapper.find(`ul#${id}_taglist`).addClass("hidden");

            that.element.on("select", that._select);
        },
        options: {
            name: "CustomMultiSelect"
        },
        _select: function (e) {
            // code to render the tag list in a div goes here

            that.trigger("select", e);
            return kendo.ui.MultiSelect.prototype._select.call(e);
        }   
    });

    kendo.ui.plugin(customMultiSelect);
})(jQuery, document); 

回答1:


I have tested the code and at first got and error - 'that is not defined'. After adding var that = this; in the '_select' method I noticed that you have to add 'that' as a first parameter to the call function. Here is the code that worked correctly at my side - https://dojo.telerik.com/@zdravkov/ApOVApiV



来源:https://stackoverflow.com/questions/52545368/extend-kendo-multiselect

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!