Kendo dataSource complex filtering example

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.default.min.css">
<script src="http://cdn.kendostatic.com/2012.1.322/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.dataviz.min.css">
<div id="grid"></div>
<br />
<select name="company" id="companies"></select>

CSS

p {
 color: blue;   
}

JavaScript

$(document).ready(function() {
                    $("#companies").kendoComboBox({
                        placeholder: "Select company",
                        dataTextField: "Name",
                        dataValueField: "Id",
                        filter: "contains",
                        autoBind: true,
                        dataSource: {
                           filter: { 
                                logic: "or",
                                filters: [
                                    { field: "Name", operator: "contains" },
                                    { field: "City", operator: "contains" }
                                ]
                            },
                            data: [
                {"Id":1,"Name":"AAA","City":"Amsterdam","Country":"The Netherlands"},
                {"Id":2,"Name":"BBB Germany","City":"Berlin","Country":"Germany"},
                {"Id":3,"Name":"CCC UK","City":"London","Country":"United kingdom"},
                {"Id":4,"Name":"DDD Belgium","City":"Bruge","Country":"The Netherlands"},
                {"Id":5,"Name":"FFF Europe","City":"Eindhoven","Country":"The Netherlands"}
            ]
                        }
                    });
                });