kendo ui grid sortable and crud无效

Question

我已经按照本教程进行了操作，并将分类工作，但现在crud操作无效。

如果我删除网格可排序代码，那么crud正在运行，但没有排序。 我不知道我在哪里犯了错误，无论是排序还是工作

这是我的代码

            $(document).ready(function () {
                function dataSource_change(e) {
                  var data = this.data();
                  console.log(data.length); // displays "77"
                }
                var dataSource = new kendo.data.DataSource({
                   //pageSize: 20,
                  transport:{
                      read:{
                        url: function() {
                          return "/makes"},
                        dataType: "json",
                        cache: false
                      },
                      update: {
                        url: function (make) {
                        console.log(make)

                        return  "/makes/"+ make.models[0].id
                        },
                        type: "PUT",
                        dataType: "json",
                        beforeSend: function(xhr) {xhr.setRequestHeader('X-CSRF-Token',jQuery('meta[name="csrf-token"]').attr("content")); }
                      },
                      destroy: {
                          url: function (make) {
                            return  "/makes/"+ make.models[0].id
                          },
                          type: "DELETE",
                          dataType: "json"
                      },
                      create: {
                          url: "/makes",
                          type: "POST",
                          dataType: "json"
                      },
                      parameterMap: function (options, operation) {
                      if (operation !== "read"  && options.models) {
                        console.log(options)
                        return{"make": options.models[0]};
                      }
                      else{
                        return {"make":options};
                        }
                      }
                  },
                  batch: true,
                   schema: {
                       model: {
                         id: "id",
                         fields: {
                            id: { editable: false, nullable: true },
                            name: { validation: { required: true } },
                         }
                       }
                   }
                });
                dataSource.bind("change", dataSource_change);
                dataSource.fetch();

                var grid = $("#grid").kendoGrid({
                    dataSource: dataSource,
                    pageable: false,
                    height: 550,
                    toolbar: [{name: "create", text: "Add New Make"}],
                    columns: [
                        { field:"name",title:"Makes" },                                      
                        { command: ["edit", "destroy"], title: "Action", width: "250px" }],
                    editable: "inline"
                }).data("kendoGrid");
                grid.table.kendoSortable({
                    filter: ">tbody >tr",
                    hint: $.noop,
                    cursor: "move",
                    placeholder: function(element) {
                        return element.clone().addClass("k-state-hover").css("opacity", 0.65);
                    },
                    container: "#grid tbody",
                    change: function(e) {
                        console.log(grid)
                        var skip = grid.dataSource.skip(),
                            oldIndex = e.oldIndex + skip,
                            newIndex = e.newIndex + skip,
                            data = grid.dataSource.data(),
                            dataItem = grid.dataSource.getByUid(e.item.data("uid"));
                        var updated_order = []
                        $('tbody tr').each(function(i){
                          updated_order.push({ name: $(this).children('td:first').text(), position: i+1 });
                        });
                        controller_name = $('#controller_name').val();
                        $.ajax({
                          type: "PUT",
                          url: '/sort',
                          data: { order: updated_order, controller_name: controller_name }
                        });

                        grid.dataSource.remove(dataItem);
                        grid.dataSource.insert(e.newIndex, dataItem);
                    }
                });

            });