kendo-grid - 在任何 CRUD 操作后通过内联编辑重新加载 Kendo Grid

Question

我正在研究 Kendo Grid CRUD Operations并希望使用其内联编辑。
我想在执行添加、删除或更新操作后执行一些操作并刷新我的网格。

我已经看到了很多解决方案。他们建议了一些事件，例如 "Change" , "RequestEnd"等等。
但是我的 RequestEnd 事件函数没有被调用，并且改变事件函数被调用，但它在任何 CRUD 操作之前而不是在操作之后被调用。

同样，我试图检查在 Kendo Grid 中的“ParameterMap”中执行了哪些操作
但它也在 CRUD 操作之前被调用。请建议我在任何 CRUD 操作后实现网格重新加载的一些解决方案。
这是我的代码:

@Imports [Shared].Models
@Imports [Shared].Enums
@code    

Layout = "~/Views/Shared/_AdminLayout.vbhtml"

@Styles.Render("~/Content/Kendo.min/css")  
@Scripts.Render("~/bundles/kendo")

Dim eventId As Guid = ViewData("EventId")

结束代码

<div>
    <br />
    Shift Grid Demo
    <br />
</div>

<div id="divEventsGrid">

    <div id="example" class="k-content">
        <div id="TestShiftGrid" style="width: 660px;"></div>
    </div>

</div>


</section>


<pre>

<script type="text/javascript">

    $(document).ready(function () {

        var crudServiceBaseUrl = '@Url.Action("JsonGetShiftList", "ManageEvents")' + "?eventId=" + '@eventId',
                   dataSource = new kendo.data.DataSource({
                       transport: {
                           read: {
                               url: '@Url.Action("JsonGetShiftList", "ManageEvents")' + "?eventId=" + '@eventId',
                               dataType: "json"

                           },
                           update: {
                               url: '@Url.Action("JsonShiftUpdate", "ManageEvents")' + "?eventId=" + '@eventId',
                               dataType: "jsonp",

                           },


                           destroy: {
                               url: '@Url.Action("JsonShiftDelete", "ManageEvents")' + "?eventId=" + '@eventId',
                               dataType: "jsonp",
                               success: function (data) {
                                   if (data == true) {
                                       alert("Record Updated Successfully")
                                   }
                               }
                           },

                           create: {

                               url: '@Url.Action("JsonShiftCreate", "ManageEvents")' + "?eventId=" + '@eventId',
                               dataType: "jsonp",
                               type: "Post"
                           },
                           parameterMap: function (options, operation) {
                               if (operation !== "read" && options.models) {
                                   return { models: kendo.stringify(options.models) };

                               }                  
                           }                         
                       },

                       change: function (e) {

                           // alert(e.type); == is not working it is showing undefined..
                           // e.action is showing my current operation but before the operation not after. 
                           if (e.action == "add")
                           {
                               $("#TestShiftGrid").data("kendoGrid").dataSource.read();
                           }


                       },
                       //requestEnd is unable to call. ?
                       requestEnd: function (data) {

                           $("#TestShiftGrid").data("kendoGrid").dataSource.read(); 
                       },
                       batch: true,
                       pageSize: 15,
                       schema: {
                           model: {
                               id: "ShiftId",
                               fields: {
                                   EventId: { editable: false, nullable: true },
                                   ShiftId: { validation: { required: true } },
                                   ShiftDate: { validation: { required: true } },
                                   FromTime: { validation: { required: true } },
                                   ToTime: { validation: { required: true } },

                               }
                           }
                       }
                   });

        $("#TestShiftGrid").kendoGrid({
            dataSource: dataSource,
            navigatable: true,
            toolbar: ["create"],
            pageable: true,
            sortable: true,
            height: 300,
            columns: [
                    {
                        field: "ShiftDate",
                        title: "Shift Date"
                    },
                    {
                        field: "FromTime",
                        title: "From Time"

                    },
                    {
                        field: "ToTime",
                        title: "To Time"

                    },
                    {
                        command: ["edit", "destroy"],
                        title: "&nbsp;",
                        width: "190px"
                    },

            ],
            editable: "inline"
        });

    });


</script>
</pre>

Answer 1

data source sync事件似乎很适合这个，它在创建、更新和删除操作之后被调用。