Home kendo multi select drag drop selection
Reply: 0

kendo multi select drag drop selection

reezvi Published in 2018-02-14 07:04:56Z

I am using kendo-ui in my angular (1.5.1) app. I want to add drag/drop support in multiselect so that users can drag and drop selection from one multiselect to another multiselect. I have tried following kendo drag/drop guideline. The problem is multiselect datasource is not updating with removed/added value. Since server side filtering is used, whenever I programmatically try updating the multiselect value, it gets cleared. Can anyone please guide me how to attain this with some example snippets? Thanks!

Updated with code snippets that I used:

on change function in multiselect -

                    change: function (e) {
                        if (e.sender.list.length > 0) {
                            var targetElement = $(e.sender.list[0]).find('div.k-list-scroller .k-item.k-state-hover.k-state-focused.k-state-selected p')

                            if (targetElement.length > 0) {
                                //get object from datasource
                                var selectedItem = _.find(scope.unifyMultiSelect.dataItems(), function (i) {
                                    return i[scope.options.dataValueField] == targetElement[0].innerText;

                                initializeDraggable(multiSelect.tagList, selectedItem);

initializeDraggable function -

                function initializeDraggable(ul, selectedItem) {
                        group: "multiSelectGroup",
                        dataValue: selectedItem,
                        hint: function (element) {
                            scope.unifyMultiSelect.value(_.without(scope.unifyMultiSelect.dataItems(), selectedItem));
                            return element.clone();
You need to login account before you can post.

About| Privacy statement| Terms of Service| Advertising| Contact us| Help| Sitemap|
Processed in 0.315548 second(s) , Gzip On .

© 2016 Powered by mzan.com design MATCHINFO