Has anyone used Dreamfactory with Kendo UI

Code Examples
1

The idea is to replace an old Reporting Solution by Dreamfactory + Kendo UI

2

It looks like Kendo is mostly JS/jQuery and integrates with AngularJS. You may find these resources helpful:

3

I am trying to use Kendo. I am working with the datasource. I am able to read data with the following:

                var dataSource = new kendo.data.DataSource({
                        transport: {
                            read: {
                                crossDomain: true,
                                url: urlData,
                                type: 'GET',
                                dataType: "json",
                                beforeSend: function(xhr){
                                    xhr.setRequestHeader("X-DreamFactory-Application-Name", applicationName)
                                    xhr.setRequestHeader("X-DreamFactory-Session-Token", sessionId)
                                }
                            }
                        },
                        //change: function(e) {
                        //    var data=this.data();
                        //},
                        batch: true,
                        pageSize: 20,
                        schema: {
                            model: {
                                id: "ProductID",
                                fields: {
                                    ProductID: { editable: false, nullable: true },
                                    ProductName: { validation: { required: true } },
                                    UnitPrice: { type: "number", validation: { required: true, min: 1} },
                                    Discontinued: { type: "boolean" },
                                    UnitsInStock: { type: "number", validation: { min: 0, required: true } }
                                }
                            }
                        }
                    });
                
                dataSource.bind("error",dataSource_error);
                
                dataSource.fetch(function(){
                   var data = this.data();
                   $('#dataresponse').html(JSON.stringify(data)); 
                   console.log(data[0].length);
                });

I am having trouble populating the grid because of the {“record”: in the beginning of the json that is returned.

I can remove by accessing data.record. I am not sure how to interact with the grid. I am new to web programming so everything is more difficult for me.