datasource.filter(...) causes a request

[Gordon]

Hi to all,

I am using your datasource for accessing an odata service. I am changing the filter when the selected row of a grid changes.
Therfore I am using the ds.filter() method.
When I check the traffic to the http endpoint via fiddler I have seen that just setting the filter fires a request to the server.
OK I thought, lets spare out the fetch method and consume the data right after setting the filter because the request has been implicitly made by the filter method.
But the data has not been updated, this is because the request will be made async I think...

So I have to call fetch and use a callback to be in sync with the request\response.

Is it possible to supress the request when setting the filter via filter() method? Otherwise these request will be made twice on every change...

--- init of data source
if (t.quickViewDataSource == null) {
                console.log("init quick view data source...");
                t.quickViewDataSource = new kendo.data.DataSource({
                    type: "odata",
                    transport: {
                        read: {
                            url: "https://someone.com/fis/odata/mydata",
                            dataType: "json"
                        }
                    },
                    sort: { field: "Released", dir: "desc" },
                    schema: {
                        data: function(data) {
                            return data.value;
                        },
                        total: function(data) {
                            return data["odata.count"];
                        },
                        errors: function(data) {

                        },
                        model: {
                            fields: {
                                FlightId: { type: 'number', nullable: false },
                                InfoType: { type: 'string' },
                                Displayname: { type: 'string' },
                                Title: { type: 'string' },
                                Released: { type: 'datetime', nullable: false },
                                Size: { type: 'number' },
                                DbTimeStamp: { type: 'datetime', nullable: false },
                                Format: { type: 'string' },
                                Identifier: { type: 'string', nullable: false },
                                OfpAltnNo: { type: 'number' }
                            }
                        }
                    },
                    filter: {
                        logic: "and",
                        filters: [
                            { field: "FlightId", operator: "eq", value: -1 },
                            { field: "InfoType", operator: "eq", value: "X" }
                        ]
                    },
                    pageSize: 1,
                    serverPaging: true,
                    serverFiltering: true,
                    serverSorting: true
                });
                t.quickViewDataSource.fetch();
            }

--- code that uses the datasource
...
var dataItem = t.mainGrid.dataItem(selected);
                var flightId = dataItem.Id;

                t.quickViewContent("LOADING...");

                t.quickViewDataSource.filter(
                    [
                        { field: "FlightId", operator: "eq", value: flightId },
                        { field: "InfoType", operator: "eq", value: type }
                    ]
                );

               t.quickViewDataSource.fetch(function () {
                    var rows = t.quickViewDataSource.data();
                    if (rows.length > 0) {
                        var row = rows[0];
                        
                        var dataUri = t.globals.baseUriBinaryData + row.Identifier;
                        $.get(dataUri).done(function(data) { t.quickViewContent(data); }).fail(function(error) { t.quickViewContent("failed to load data from server: " + error); });
                    } else {
                        t.quickViewContent("NO DATA AVAIABLE");
                    }
                });

[Kiril Nikolov]

Hi Gordon,

Have you tried using the query() method? It will both read the data from the remote service and you can pass the filter expression. Here is the documentation about it:

http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#methods-query

Regards,
Kiril Nikolov
Telerik

 

 

[Gordon]

Thanks a lot! This works fine.

[Gordon]

I am sorry... I was lazy and have not tested it correctly...
The problem regarding the async loading and getting old data when accessing the data from the datasource immediatly after calling query\filter is the old data from the request done before.
Is query\filter promise ready, are there callbacks I can use or are there any other possibilities to read the data from the source after the query is done?

Kind regards
Gordon

[Kiril Nikolov]

Hello Gordan,

What you can do is to attach a change event handler, for the dataSource change event, so when this change is fired you will be sure that the new data is fetched. More documentation is available here:

http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#events-change

Regards,
Kiril Nikolov
Telerik