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