This is a migrated thread and some comments may be shown as answers.

Angularjs + Kendo Grid and Web API C#

1 Answer 185 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Gary
Top achievements
Rank 1
Gary asked on 09 Mar 2016, 04:25 PM

Hi,

I try to implement the kendo grid with angular.js and my backend is web (C#).  I found there is not many on the internet except one with OData and not so much doc about it.

Can you provide me a sample with inline editing for all the basic CRUD for  

I implemented the read and the create but the problem of the create it's on the callback here how I created my .

            return new kendo.data.DataSource({

                transport: {
                    read: function (options) {

                        hideShowGridLoadingSpinner(true);

                        var webapi = new kendo.data.transports.webapi({ prefix: "" });

                        var params = webapi.parameterMap(options.data);

                        _options = options;

                        $http.get("/api/country", { params: params }).success(onSuccess).error(onError);
                    },
                    create: function (options) {

                        hideShowGridLoadingSpinner(true);

                        var webapi = new kendo.data.transports.webapi({ prefix: "" });

                        var params = webapi.parameterMap(options.data);

                        $http.post("/api/country",options.data).success(onSuccess).error(onError);
                    }
                },
                pageSize: 10,
                serverPaging: false,
                serverSorting: false,
                serverFiltering: false,
                schema: $.extend({}, kendo.data.schemas.webapi, { data: "data", total: "total", errors: "errors" }),
                schema: {                    
                    model: {
                        id: "id",
                        fields: {
                            id: { type: "number", editable: false },
                            name: { type: "string", validation: { required: true } }
                        }
                    }
                }

            });

Here the success  

 

        function onSuccess(data) {

            hideShowGridLoadingSpinner(false);

            if (data.errors == undefined) {
                _options.success(data.data);
            } else {
                _options.error();
                eventBus.showErrorNotification(data.errors);
            }            
        }

 

The main problem is the data returned is the object added so when I pass this to the success method all object in the grid are flush except the new one added.  Is normal but how I can update the grid with the new inserted data without doing a callback to the get method ?

 

Thanks

1 Answer, 1 is accepted

Sort by
0
Gary
Top achievements
Rank 1
answered on 09 Mar 2016, 04:33 PM

Sorry I found the problem I needed to keep a reference to the options parameter before calling the POST method and in the callback I use this reference and it works.  My bad, no need of sample

Thanks

Tags
Grid
Asked by
Gary
Top achievements
Rank 1
Answers by
Gary
Top achievements
Rank 1
Share this question
or