Kendo网格行在插入时重复

Question

I have a Kendo grid containing data rows where if two new rows are added consecutively, the first row that was added into the grid will have a duplicate record inserted into the SQL db table. I've seen other posts where the suggestion has been to use the "complete" event on the create event:

transport: {
        read: UrlBase + "getAll",
        create: {
            url: UrlBase + "create",
            dataType: "jsonp",
            complete: function (e) {
                $("#grid").data("kendoGrid").dataSource.read();
            }
        },

The issue is, in my code, I'm using model binding to send the data to the server side and the grid structure needs to be maintained as well:

<div class="k-pane">
        @{
            Html.Kendo().Grid(Model)
            .Name("exampleGrid")
            .Columns(columns =>
            {
                columns.Select().Width(60);
                columns.Bound(c => c.exampleUniqueID).Hidden(true);
                columns.Bound(c => c.example1ID).Hidden(true);
                columns.Bound(c => c.example2ID).Hidden(true);
                columns.Bound(c => c.example1CD).EditorTemplateName("exampleDropDown").Width(300);
                columns.Bound(c => c.EffectiveDate).Format("{0:MM/dd/yyyy}").EditorTemplateName("EffectiveDatePicker");
                columns.Bound(c => c.EndDate).Format("{0:MM/dd/yyyy}").EditorTemplateName("EndDatePicker");
                columns.Bound(c => c.SortOrder);
                columns.Bound(c => c.AddedBy);
                columns.Bound(c => c.AddedOn);
                columns.Bound(c => c.UpdatedBy);
                columns.Bound(c => c.UpdatedOn);

            })

            .ToolBar(toolbar =>
            {
                toolbar.Create().Text("Add");
                toolbar.Save().SaveText("Save");

            })
            .Editable(editable => editable.Mode(GridEditMode.InCell).DisplayDeleteConfirmation(false))
            .Scrollable()
            .Sortable()
            .Events(e => e.SaveChanges("exampleGrid_onSaveChanges"))
            .DataSource(datasource => datasource
                           .Ajax()
                           .Model(model =>
                               {
                                   model.Id(d => d.exampleUniqueID);
                                   model.Field(f => f.AddedBy).Editable(false);
                                   model.Field(f => f.AddedOn).Editable(false);
                                   model.Field(f => f.UpdatedBy).Editable(false);
                                   model.Field(f => f.UpdatedOn).Editable(false);
                               }
                            )
                           .ServerOperation(false)
                           .Read(read => read.Action("ControllerAction", "ControllerName"))
                           .Create(create => create.Action("ControllerAction_Create", "ControllerName").Data("exampleGrid_onAdditionalData"))
                           .Update(update => update.Action("ControllerAction_Create", "ControllerName"))
                           .Destroy(delete => delete.Action("ControllerAction_Delete", "ControllerName"))
                           .Events(e => e.Error("exampleGridDS_onError"))
                        )
            .Render();

        }
    </div>

Because the grid uses the arrow syntax in the event method calls (for read, update, create, etc) and because the "complete" event is used in the JSON format definition of data source, how can the "complete" event be used in the above grid? If it can't be, how can the duplicates be prevented from be inserted in to the sql table?

Answer 1

Use requestEnd event for dataSource. It'll call after the transport methods.

.Events(events => events.RequestEnd("add_a_javascript_method"))