简体   繁体   中英

Kendo UI grid is not firing create, update and destroy events

i tried to fire the Create event in transport section of the Kendo Datagrid. I tried to read the whole documentation for Kendo Datagrid but i'm not able to fire create, update and destroy events.

Could somebody please tell me what can be wrong in my code?

Thanks for any advice.

Here is the source of method:

/**
     * Fill data grid by users 
     * @param {Number} a 
     * @param {Number} b
     * @return {Number} sum
     */
    $scope.initTable = function() {
        // get access token from localstorage
        var token = localStorage.getItem($rootScope.lsTokenNameSpace);
        // set pagination data
        var paginationData = {
            "token" : token,
            "data" : {
                "page" : 1,
                "items_per_page" : 20
            }
        };

        $("#grid").kendoGrid({
            dataSource : {
                transport : {
                    // read list 
                    read :  function(options) {
                        $.ajax({
                            url: $rootScope.apiBaseUrl + "user/list",
                            dataType: "json",
                            type : "POST",
                            data: JSON.stringify(paginationData),
                            success: function(response) {
                                console.log("List of users succesfully obtained");
                                console.log(response.result); 
                                // pass response to model
                                options.success(response);
                               // $notification.enableHtml5Mode();
                            },
                            error: function(error) {
                              console.log("user list request error");
                              console.log(error);
                              $notification.error( "User list cannot be loaded", "Please try again in a minute.");
                            }
                          });
                    },
                    // create list item
                    create :  function(options) {
                        console.log("Create function");
                    },
                    // update list item
                    update :  function(options) {
                        console.log("Update function");
                    },
                    // destroy list item
                    destroy:  function(options) {
                        console.log("Destroy function");
                    },
                    // important for request
                    parameterMap: function(options, operation) {
                        console.log(options);
                        console.log(operation);
                    if (operation === "read") {
                        // send parameter "access_token" with value "my_token" with the `read` request
                        return {
                            data: paginationData,
                            token: token
                        };
                    } else
                        return {
                            data: kendo.stringify(options.models),
                            access_token: "my_token"
                        };
                    }
                },
                // data model
                schema : {
                    // JSON data parrent name
                    data : "result",
                    model : {
                        fields : {
                            id : {
                                type : "integer",
                                editable: false, 
                                nullable: true 
                            },
                            username : {
                                editable: "inline",
                                type : "string",
                                validation: {
                                    required: {
                                        message: "Please enter a Username"
                                    }
                                }
                            },
                            name : {
                                type : "string"
                            },
                            surname : {
                                type : "string"
                            },
                            email : {
                                type : "string"
                            },
                            created : {
                                type : "string"
                            },
                            role : {
                                type : "string"
                            }
                        }
                    }
                },
                // data source settings
                pageSize : 10,
                editable: true,
                serverPaging : false,
                serverFiltering : false,
                serverSorting : false,
                batch : true
            },
            // data grid settings and customization
            toolbar : ["create"],
            editable: true,
            height : 350,
            filterable : true,
            sortable : true,
            pageable: {
                refresh: true,
                pageSizes: true,
                buttonCount: 5
            },
            selectable: "multiple, row",
            // columns
            columns : [ {
                field : "id",
                title : "ID"
            }, {
                field : "username",
                title : "Username"
            },{
                field : "name",
                title : "Name"
            },{
                field : "surname",
                title : "Email"
            },{
                field : "email",
                title : "Email"
            },{
                field : "created",
                title : "created at"
            },{
                field : "role",
                title : "Role"
            },
            {   // table action buttons
                command: [
                          {name: "edit"},
                          {name: "destroy", text: "Remove"},
                          {name: "detail", click:redirectToUserDetal},

                ] ,
                // Action column customization
                title: "Action", 
                width: "300px"
            }
            ]
        });
    };


});

have faced same issue. But I have solved using this.

To fire create/delete/update we need to specify schema in dataSource( in schema we should mention atleast what is id field).

schema: { model: { id: "StudentID" } }

Code:

var dataSource = new kendo.data.DataSource({
   transport: {
        read: function (options) {
            alert("read");              
        },
        create: function (options) {                    
                               alert("create");             
        },
        update: function (options) {                    
                               alert("update");                },
        destroy: function (options) {                    
                               alert("destroy");                }
    },
                schema: {
        model: {
            id: "StudentID"
        }
    }

You configured your dataSource for batch mode, batch: true , but you provided no way to save the changes. Remember that batch mode queue's up all of your create, update, and destroy actions. They are all fired at once when the dataSource is synced, (ie dataSource.sync() ).

The simplest way to enable this, given your config, is add 'save' to your toolbar. You might also want to include 'cancel' as well.

toolbar : ["create", "save", "cancel"],

Make sure your id is set on the objects that your read action is returning.

I had the same issue with my update action not being hit. I checked Fiddler and the POST was being made, but my id field was not set. I traced this back and found that my id was not being set on the objects when they were returned by my read action.

Without the id field being sent in the POST, my controller didn't recognize the parameters, thus not hitting my action.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM