Kendo Angular multiselect set selected values
Asked Answered
N

2

2

I´m using Kendo multiselect with Angular-Kendo directives and with remote datasource. I´m trying to set the selected items when the application starts but with no luck. Can anyone please help me?

See Code here: JS Bin

Nassi answered 28/11, 2013 at 0:3 Comment(0)
G
2

You can just make a custom directive, and pass in the items you want selected beforehand to the value attribute of the multiselect directive, have a look at this Plunk to see the directive I use.

Galer answered 23/12, 2013 at 10:58 Comment(1)
Hey! Your custom directive has helped me a great deal. I forked it and edited it here (plnkr.co/edit/Z1E9FO8NAgpiSggSo3hY?p=info) I added a pop method to directly modify myItems. But -- when this is run, the change is not reflected in the multi-select. How could I modify the directive to account for that?Gangrene
A
1

You have to hook into the on change event directive and send the kendoEvent. Then you can use the supported kendo methods on e.sender. Check it out on this plunker

    <select id="required" multiple="multiple"  kendo-multi-select k-on-change="changed(kendoEvent)">
        <option>Steven White</option>
        <option>Nancy King</option>
        <option>Nancy Davolio</option>
        <option>Robert Davolio</option>
        <option>Michael Leverling</option>
        <option>Andrew Callahan</option>
        <option>Michael Suyama</option>
        <option selected>Anne King</option>
        <option>Laura Peacock</option>
        <option>Robert Fuller</option>
        <option>Janet White</option>
        <option>Nancy Leverling</option>
        <option>Robert Buchanan</option>
        <option>Margaret Buchanan</option>
        <option selected>Andrew Fuller</option>
        <option>Anne Davolio</option>
        <option>Andrew Suyama</option>
        <option>Nige Buchanan</option>
        <option>Laura Fuller</option>
    </select>

    var app = angular.module('app', ['kendo.directives']); 

    app.controller("myCtrl", function ($compile, $scope) {

      $scope.changed = function(e) {
      console.log(e.sender.dataItems());
      };

    });
Asafetida answered 6/12, 2013 at 0:45 Comment(2)
Change is fired when the value of the widget is changed by the user, not when it is initially loadedArthromere
I think initial onload you have read the data from db or related areas.Opulent

© 2022 - 2024 — McMap. All rights reserved.