lost rebind with autocomplete

[Lisa]

Hi,

Here is a multiselect which I want to change its value on the change event. It pre-select three options, when mouse click the dropdown and pick an extra one, it will reset it back to two options. Now click the dropdown, use autocomplete (key in E which shows option EEE) to choose an extra option, the multiselect become empty. Please see the file attached. How to rebind it with autocomplete?

        <select kendo-multi-select="productSelect" k-options="selectOptions" ng-model="selectedIds"
         k-on-change="isChanging(kendoEvent)"
        ></select>
        <button data-kendo-button data-ng-click="reset()">Reset</button>

 

$scope.selectOptions = {
            placeholder: "Select products...",
            dataTextField: "ProductName",
            dataValueField: "ProductID",
            valuePrimitive: true,
            autoBind: false,
           dataSource: {
                  data: [
                    { ProductName: "AAA", ProductID: 1 },
                    { ProductName: "BBB", ProductID: 2 },
                    { ProductName: "CCC", ProductID: 3 },
                    { ProductName: "DDD", ProductID: 4 },
                    { ProductName: "EEE", ProductID: 5 }
                  ]
            }
        };
   
        $scope.selectedIds = [ 1, 2, 3 ];
   
        $scope.reset = function(){
          $scope.selectedIds = [ 1, 2, 3 ];
        }
 
        $scope.isChanging = function(kendoEvent){
          $scope.selectedIds = [ 3, 5 ];
        }  

Thanks,

Lisa

[Georgi Krustev]

Hello Lisa,

The described behavior is expected. The widget cannot select items that does not present in its data source, which is the case when the source is filtered. If you would like to update values on change, then you will need to clear the filter first:

$scope.isChanging = function(kendoEvent){
   kendoEvent.sender.dataSource.filter({});
   $scope.selectedIds = [ 3, 5 ];
}

Regards,
Georgi Krustev
Telerik

 

 

[Lisa]

Thanks Georgi, this fixed it.