Telerik UI for Windows 8 HTML
Contents

The DataSource supports filtering its data. This is achieved by assigning it one or more filter expressions. Filtering can be performed both automatically by the control and on the server by passing it the filter expressions.

Define Filter Expressions

To achieve filtering, assign the filter property of the component an expression in the format { field: "fieldName", operator: "eq", value: 12 } or an array of such expressions. The options meaning is as follows:

  • field: The field by which the data source should be filtered.

  • operator: The filter function (see the table below) and value is the filter value.

  • value: The value to which each field value should be compared.

Possible values for the operator field are:

Logic

Accepted values

Equal To

"eq", "==", "isequalto", "equals", "equalto", "equal"

Not Equal To

"neq", "!=", "isnotequalto", "notequals", "notequalto", "notequal", ne

Less Than

"lt", "<", "islessthan", "lessthan", "less"

Less Than Or Equal To

"lte", "<=", "islessthanorequalto", "lessthanequal", "le"

Greater Than

"gt", ">", "greaterthan", "greater"

Greater Than Or Equal To

"gte", ">=", "greaterthanorequalto", "greaterthanequal", "ge"

Starts With

"startswith"

Ends With

"endswith"

Contains

"contains"

Below you can see a basic DataSource filtering definition:

Filter Basic Definition Copy imageCopy
var myDataSource = new Telerik.Data.DataSource({
    data: [
        { title: "The Lord of the Rings: The Two Towers", year: 2002 },
        { title: "Batman Begins", year: 2005 },
        { title: "Inception", year: 2010 }
    ],
    filter: { field: "year", operator: "gt", value: 2003 }
});

myDataSource.read().then(function () {
    //data is filtered to Batman Begins and Inception
    var data = myDataSource.view;
});

Define Complex Filter Expressions

To form a more complex filtering expressions, use the logic and filters properties of the filter. The logic property value must be either "and" or "or" meaning the filter expression will be a logical conjunction or a logical disjunction. The default logic value is "and". The filters property takes an array of basic filter expressions used for forming the complex filter expression.

In the example below, the data is filtered to all data entries that have an "year" field value less than 2004 or greater than 2006.

Filter Extended Definition Copy imageCopy
var myDataSourceExtended = new Telerik.Data.DataSource({
    data: [
        { title: "The Lord of the Rings: The Two Towers", year: 2002 },
        { title: "Batman Begins", year: 2005 },
        { title: "Inception", year: 2010 }
    ],
    filter: {
        logic: "or",
        filters: [
            { field: "year", operator: "gt", value: 2006 },
            { field: "year", operator: "lt", value: 2004 },
        ]
    }
});

myDataSourceExtended.read().then(function () {
    //data is filtered to The Lord of the Rings and Inception
    var data = myDataSource.view;
});

Server Filtering

When bound to remote data, the Boolean serverFiltering property defines how filtering is performed. If the value is set to true, the DataSource sends filter expressions to the server and expects the filtered result. Note that based on the scenario, you may need to use the transport.parameterMap property to modify the object sent to the remote endpoint. For more information, see the Configuring Remote Binding article. The default value of the serverFiltering property is false, meaning data is filtered locally inside the DataSource.

See Also