Kendo UI datasource filter by comparing fields

Question

I have a Kendo UI DataSource and I want to filter it by comparing fields. This is my datasource:

var dataSource = new kendo.data.DataSource({
  data: [
    { appointment: "Hairdresser", start: new Date("somedate"), end:  new Date("somedate")},
    { appointment: "Meeting", start: new Date("somedate"), end:  new Date("somedate")},
    { appointment: "Shopping", start: new Date("somedate"), end:  new Date("somedate")}
  ]
});

And I want to filter it like this:

SELECT * FROM dataSource WHERE start > end;

dataSource.filter({
                "field": "start",
                "operator": "gt",
                "value": ?????
            });

How can I achieve this using filters?

Answer 1

This is not possible with the built-in filtering. Instead I would suggest you to create a button which on click will send some extra parameters to the server where you can perform such filtering on your own.

To send additional fields and perform a Read request you can go like this

dataSource.read({ myCustomFilter:true });

Answer 2

If you want to do this client-side, I'd suggest using something like lo-dash's filter method (or, depending on the browsers you need to support, simply the native Array.filter implementation) to implement your filter.

You could store all data in an external array and only keep the filtered data in the data source which is bound to the UI (update with dataSource.data()):

var data = [{
    name: 'barney',
    age: 36,
    start: new Date(2011, 1, 1),
    end: new Date(2012, 1, 1)
}, {
    name: 'fred',
    age: 40,
    start: new Date(2011, 1, 1),
    end: new Date(2010, 1, 1)
}];

var filtered = _.filter(data, function (item) {
    return item.start > item.end;
});

dataSource.data(filtered);