Grid refresh on Add or Delete with Angular

[Mark]

I'm using Kendo UI grid with angular and webapi2 backend.  If I update a row on the backend and refresh the grid, the changed data is reflected just fine.  If I add or delete a row the grid does not reflect this change (unless I do a full page refresh).  My refresh function is as follows:

$scope.grid.datasource.transport.read();

$scope.grid.refresh();

Debugging network requests shows the correct JSON data being returned from webapi, the control just does not reflect the updated data set.

 

[Dimiter Topalov]

Hi Mark,

In general data item changes are saved ti the Grid's dataSource via its sync() method. The dataSource.transport.read option should be used to configure how the data source loads data items from a remote service, it cannot be invoked as a method. On the other hand, there is a dataSource.read() method.

You can check out the following examples, and documentation on Web API editing, and server operations:

https://github.com/telerik/kendo-examples-asp-net-mvc/tree/master/grid-data-source-request-web-api

http://docs.telerik.com/kendo-ui/aspnet-mvc/helpers/grid/editing/webapi-editing

https://github.com/telerik/ui-for-aspnet-mvc-examples/tree/master/grid/grid-web-api-crud-incell

http://docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/web-api-server-operations

... and try to apply the necessary adjustments to your implementation.

If the problem persists, we will need a similar isolated runnable project, where it can be observed, so we can inspect it further.

Regards,
Dimiter Topalov
Telerik by Progress