Kendo-UI datasource "contains" filter not working

Question

I cannot seem to get filtering to work with a "contains" filter operator in a multiselect datasource. I'm using AngularJS and to provide an example, I modified the MultiSelect example on the Telerik demo site. It is filtering with "starts-with" even though I specified "contains":

angular.module("KendoDemos", ["kendo.directives"]);

function MyCtrl($scope) {
    $scope.selectOptions = {
        placeholder: "Select products...",
        dataTextField: "ProductName",
        dataValueField: "ProductID",
        autoBind: false,
        dataSource: {
            type: "odata",
            serverFiltering: false,
            filter: {
                field: "ProductName",
                operator: "contains"
            },
            transport: {
                read: {
                    url: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Products",
                }
            }
        }
    };
    $scope.selectedIds = [4, 7];
}

demo: http://jsbin.com/riwavomeleza/1/edit

Answer 1

You want to specify the widget's filtering behavior, not the data source filters, so you need to use the filter option for the multi-select widget:

angular.module("KendoDemos", ["kendo.directives"]);

function MyCtrl($scope) {
    $scope.selectOptions = {
        placeholder: "Select products...",
        dataTextField: "ProductName",
        dataValueField: "ProductID",
        autoBind: false,
        filter: "contains",
        dataSource: {
            type: "odata",
            serverFiltering: false,
            transport: {
                read: {
                    url: "...",
                }
            }
        }
    };
    $scope.selectedIds = [4, 7];
}