marinvirdol
marinvirdol

Reputation: 1473

how to append selected items to a Kendo multiselect using angularjs?

Check this: http://jsfiddle.net/nDmjt/5/

$("#button").on("click", function () {
var res =  multiselect.value().slice();
    res.push('customerStatusIds:25');
    res.push('priorityIds:1');


    multiselect.dataSource.filter({});
    multiselect.value(res) 

}); 

Do you have any idea on how can I achieve the same behaviour using angular js ? Thanks in advance.

Upvotes: 1

Views: 4228

Answers (2)

Sajjad Ali Khan
Sajjad Ali Khan

Reputation: 1813

check this link related to Kendo-ui/multiselect/angular

they provide us with one example suitable to ur question.

I used this example to append selected items to MultiSelect.

Inside controller:

Example:

$scope.ToothOptions = {
        autoBind: false,
        dataSource: $scope.toothsDataSource, // datasource
        dataTextField: 'ToothQuarterName',
        dataValueField: 'ToothID',
        filter: 'contains'
        valuePrimitive: true
    };

$scope.SelectedTooths=[];

UI(view)

<input class="form-control input-xs" 
       kendo-multi-select
       k-options="ToothOptions" 
       k-ng-model="SelectedTooths" />

if u just update the array $scope.SelectedTooths with values like [5,6], then multiselect will gets updated with tooths(toothID : 5, toothID:6).

Upvotes: 1

marinvirdol
marinvirdol

Reputation: 1473

Angular :

$scope.data = { names: []};

$scope.nameDataSource = new kendo.data.DataSource({
      data: [{ name: 'Vignesh' }, { name: 'Rizwan' }]
});

$scope.nameOptions = {
      placeholder: "Select",
      dataSource: $scope.nameDataSource ,
      dataTextField: "name",
      dataValueField: "name",
      valuePrimitive: true,
      autoBind: false
}  

$scope.data.names.push('Riyaz');

Html :

<select id="name" kendo-multi-select ng-model="data.names" k-data-source="nameDataSource" k-option-label="{name: 'Name'}" k-options="nameOptions" style="width:200px"></select>

Upvotes: 4

Related Questions