Kendo UI网格插入/更新将创建重复记录(再次) [英] Kendo UI Grid Inserts/Updates create Duplicate Records (again)
问题描述
在这个主题上，我和丹尼尔有同样的问题，但是他的解决方案对我不起作用:
I have same problem as Daniel had in this topic, but his solution doesn't work for me:
So use-case. Users adds 2 new records one after another:
- 按下网格的添加新记录"按钮
- 填写字段(名称="Alex"，金额= 10，注释=第一").
- 记录一已准备好.按保存". (数据流向控制器，而不是数据库)
-
用户在网格中看到一条记录
- Presses "Add new record" button of a grid
- Fills the fields (name="Alex", amount=10, comment="first").
- Record one is ready. Press 'Save'. (data goes to controller and than to Database)
User see one record in a grid
再次按添加新记录"按钮
Press "Add new record" button again
记录一已准备好.按保存".数据流向控制器，而不是数据库. 在这一刻发生了什么，网格再次发送Ajax请求，并将一个数据记录到控制器.
Record one is ready. Press 'Save'. Data goes to controller and than to Database. In this moment something happens and grid send Ajax request again with record one data to controller.
用户更新网格并查看三个记录
User updates grid and see three records
亚历克斯| 10 |首"(重复记录)ID = 1
"Alex | 10 | first" (duplicated record) ID = 1
鲍勃| 20 |秒" ID = 2
"Bob | 20 | second" ID = 2
亚历克斯| 10 |第一个" ID = 1
"Alex | 10 | first" ID = 1
他们建议返回ID，以正确绑定\更新具有新记录的数据源. 然后我将其退回(来自数据库的新ID以bouns实体作为响应)！这没有帮助. 仅当我添加第一条记录并使用F5刷新页面，然后添加第二条记录时，一切正常.但是，如果再添加一条，则第三条记录-问题再次出现
They recommend to return an ID for correct binding\update of data source with new record. And I return it (new ID from database comes in response with bouns entity)! and this doesn't help. Only if I add first record and refresh page with F5 and after that add second record everything is ok. But if add another one, the third records - problems appears again
控制器中的代码
[HttpPost]
public JsonResult Create(BonusDto bonusDto)
{
BonusAggregate bonus;
if (bonusDto.Amount <= 0)
throw new ArgumentOutOfRangeException("Amount should be more than 0");
if (bonusDto.EmployeeId <= 0)
throw new ArgumentNullException("You should specify an existing employee");
using (var dbContext = new DatabaseContext())
{
BonusesRepository = new BonusesRepository(dbContext);
var employeeRepository = new EmployeesRepository(dbContext);
bonus = new BonusFactory(employeeRepository).Create(bonusDto);
BonusesRepository.Save(bonus);
}
HttpContext.Response.StatusCode = (int)HttpStatusCode.Created;
return Json(bonus); // try to return ID after bonus was saved
}
UI代码
// creates bonuses grid control
$("#bonusesGrid").kendoGrid({
dataSource: bonusesDataSource,
toolbar: ["create"],
editable: "inline",
columns: [
"BonusId",
"EmployeeId",
{
field: "EmployeeLastName",
editor: employeeAutocompletingEditor,
template: "#=EmployeeLastName#"
},
"Amount",
{
field: "Comment",
titel: "Comment",
editor: textareaEditor,
filterable: {
operators: {
number: {
contains: "Contains"
}
}
}
},
{
command: ["edit"],
title: " "
}
],
save: function(e) {
if (newValueEmployeeId !== undefined &&
newValueEmployeeLastName !== undefined &&
newValueEmployeeLastName !== "") {
setNewValueEmployeeIdAndLastName(newValueEmployeeId, newValueEmployeeLastName);
gridDataSource.model.EmployeeId = newValueEmployeeId; // it's a hack to bind model and autocomplete control
gridDataSource.model.EmployeeLastName = newValueEmployeeLastName;
} else {
gridDataSource.model.EmployeeId = currentValueEmployeeId;
gridDataSource.model.EmployeeLastName = currentValueEmployeeLastName;
}
},
edit: function(e) {
setCurrentValueEmployeeIdAndLastName(e.model.EmployeeId, e.model.EmployeeLastName);
},
cancel: function(e) {
setCurrentValueEmployeeIdAndLastName(e.model.EmployeeId, e.model.EmployeeLastName);
}
});
奖金数据源:
// bind json result from /Bonuses/GetPagedJsonBonuses
var bonusesDataSource = new kendo.data.DataSource({
transport: {
read: {
url: "@Url.Action("GetPagedJsonBonuses", "Bonuses")",
type : "GET",
contentType: "application/json",
dataType: "json",
cache: false
},
create: {
url: "@Url.Action("Create", "Bonuses")",
dataType: "json",
type: "POST"
},
parameterMap: function(options, operation) {
if (operation === "update" || operation === "create") {
// correct format for conversion
var d = new Date(options.Date);
options.Date = kendo.toString(d, dateFormat);
// updates the BonusDTO.EmployeeId with selected value
if (newValueEmployeeId !== undefined)
options.EmployeeId = newValueEmployeeId;
}
if(operation === "read") {
options.filter = setFormattedFilterDate(options.filter);
}
return options;
}
},
pageSize: 15,
serverPaging: true,
serverSorting: true,
serverFiltering: true,
error: showErrorMessage,
schema: {
data: "Data", // PagedResponse.Data
total: "TotalCount", // PagedResponse.TotalCount
model: {
id: "BonusId", // Data
fields: {
EmployeeId: { type: "number" },
EmployeeLastName: {
type: "string",
editable: true,
nulable: false,
validation: { required: {message: "Employee's last name is required"}}
},
Date: {
type: "date",
editable: true,
nullable: false,
validation: {
required: { message: "Date is required to be set" }
}
},
Amount: {
type: "number",
editable: true,
nullable: false,
defaultValue: 1,
validation: {
required: { message: "Amount is required to be set" }
}
},
Comment: { type: "string", editable: true }
} // fields
} // model
}// schema
});
推荐答案
在我的代码中没有看到此问题.但是，我在创建和更新事件时确实有一个完成"事件处理程序，该事件处理程序刷新了网格-它可能会帮助您:
I haven't seen this problem in my code. I do however have a "complete" event handler on my create and update events that refreshed the grid - it may help you:
dataSource: {
type: "jsonp",
transport: {
read: UrlBase + "getAll",
update: {
url: UrlBase + "Update",
dataType: "jsonp",
complete: function (e) {
$("#grid").data("kendoGrid").dataSource.read();
}
},
create: {
url: UrlBase + "create",
dataType: "jsonp",
complete: function (e) {
$("#grid").data("kendoGrid").dataSource.read();
}
},
destroy: {
url: UrlBase + "destroy",
dataType: "jsonp",
complete: function (e) {
$("#grid").data("kendoGrid").dataSource.read();
}
}
},
...
这篇关于Kendo UI网格插入/更新将创建重复记录(再次)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
