CRUD Operations in nested grid using AngularJS

[Andrew]

Hey guys, 

Been putting together a solution using kendo ui grids and AngularJS, but hit the wall when trying to perform CRUD operations in a nested grid.  I did do some research but couldn't get an straight answer so this is my last resource. 

As I said, got grid inside a grid, and I need to be able to perform CRUD operations.  This is what the markup looks like 

<div kendo-grid="firstgrid" k-options="context.gridOptions">
         <div k-detail-template>
               <div kendo-grid="secondgrid" k-options="secondGridOptions(dataItem)"></div>
         </div>
 </div>

 nothing especial there, here's the secondGridOptions function

 $scope.secondGridOptions = function (dataItem) {
        return {
            dataSource:  { 
                transport: {
                    read: "api/Entity/" + dataItem.ID,
                    update: function (options) {
                        angularResourceSvc.entity.update({}, options.data, function (response) {
                            console.log(response);
                        });
                    },
                    destroy: function (options) {
                        angularResourceSvc.entity.delete({ id: options.data.Id}, function (response) {
                            console.log(response);
                        });
                    },
                    create: function (options) {
                        options.data.RAID = $stateParams.RAID;
                        angularResourceSvc.entity.save({}, options.data, function (response) {
                            console.log(response);
                        });
                    }
                }
            },

I've omitted the rest of the function for brevity (schema, columns etc)

As you can see I'm using an angular service to perform the operations, and this is what I've used on all the other grids in the app, which works pretty well.

Normally this is what my read looks like:  

read: function (options) {
             options.success($scope.dataCollection)
    },

 and this is how I call it whenever I need to get/refresh the data

 $scope.dataCollection = rangularResourceSvc.entity.query({}, function (result) {
          $scope.mygrid.dataSource.read();
   });

 

But since this is a function (as opposed to a kendo data source) I didn't really know how to  "read" the data like I've done in my other grids, so I decided to just use the url.

Reading the data works fine, but that's about it. It won't update, delete or create... nothing happens, no error message, nothing..  the events just won't fire.

Did a little but of digging on this and found a post where it says that all CRUD operations had to be the same, so either reading straight from the Url or a function; so I changed the read operation to a function (a bit of a hack really) so it'd read "local" data that I'm just pulling onload.. but same thing, rows are fine, grid gets displayed properly, but that's as far as it'll go.

 

Any help would be very much appreciated 

 

 

[Alexander Valchev]

Hello Andrew,

Thank you for getting in touch with us.

What you found in the forums is correct - all CRUD operations has to be the same, so either reading straight from the URL or a function.

Based on the provided information I cannot determine why the create, update and destroy functions are never called. Usually such problems are related the ID of the record which is defined in the schema. Does each record have a unique ID? Is it possible for you to set up a small Kendo Dojo test page which demonstrates the issue so I can examine your current implementation in details?

Looking forward to your reply.

Regards,
Alexander Valchev
Telerik

 

 

[Andrew]

Hi Alexander, 

thanks for the reply yes, each record has an ID.  That makes me think.. how about empty grids?? I mean if the issue was the id, this shouldn't be the case for a grid with no rows. I did try that, but the create function doesn't fire either.

I also tried only using Urls  (as opposed to function) and still same issue.

anyway..  we've abandoned  this approach for now, so no need to worry about it.