Kendo Multiselect with AngularJS - angularjs

Question

I want to set maxSelectedItems from a textbox value. Apart from that I want to reset kendo multiselect if textbox value change. I have tried below thing but it is not working.
<input type="hidden" ng-model="DTO.ProgramID" id="ProgramID" value="3">
<input class="form-control" data-val="true" id="ClassSize " maxlength="2" name="ClassSize " ng-model="DTO.ClassSize "type="text" ng-blur="OnClassSizeChange()">
<select id="CourseClientIDs" kendo-multi-select k-options="selectClientOptions" ng-model="DTO.CourseClientIDs"></select>
$scope.selectClientOptions = {
placeholder: "---Select Clients---",
dataTextField: "ClientFLName",
dataValueField: "ClientID",
valuePrimitive: true,
autoBind: false,
dataSource: {
type: "jsonp",
serverFiltering: true,
transport: {
read: {
url: "Home/ClientDataSource/",
cache: false
},
parameterMap: function (data, action) {
if (action === "read") {
if ($scope.DTO.ProgramID != undefined) {
return {
programID: $scope.DTO.ProgramID
};
}
} else {
return data;
}
}
}
}
};
$scope.OnClassSizeChange = function () {
if ($scope.DTO.ClassSize == 0) {
var message = "Class size cannot be 0.";
return false;
}else{
$scope.selectClientOptions.maxSelectedItems = $scope.DTO.ClassSize; //Not Working
$scope.selectClientOptions.dataSource.read(); //Not Working
}
return true;
};
I am trying angularjs with kendo first time. Please help me.

Answer 1

In the textbox define ngChange specify the function to execute when value change. Supposing ngModel for textbox is in $scope.nvm, try this:
$scope.nvm = 1; //value in textfield
$scope.setnvm = function(){//change maxSelectedItems and reset values
var ms = angular.element(document.getElementById("sems")).data("kendoMultiSelect");
ms.setOptions({
maxSelectedItems: $scope.nvm,
});
ms.value([]);
};