Kendo UI 网格插入/更新创建重复记录(再次) [英] Kendo UI Grid Inserts/Updates create Duplicate Records (again)
问题描述
我和 Daniel 在这个主题中遇到了同样的问题，但他的解决方案对我不起作用:
I have same problem as Daniel had in this topic, but his solution doesn't work for me:
所以用例.用户一个接一个地添加了2条新记录:
So use-case. Users adds 2 new records one after another:
- 按下网格的添加新记录"按钮
- 填写字段(name="Alex"、amount=10、comment="first").
- 记录一已准备就绪.按保存".(数据进入控制器而不是数据库)
用户在网格中看到一条记录
- 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
Alex | 10 | first"(重复记录)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 bindingupdate 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
}
界面代码
// 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屋！
