在我的示例中,我在Grid单元中使用了DropdownList。
我可以从下拉菜单中选择项目,对其进行编辑,然后我可以删除行,但是在所有更改之后,DataSource.parameterMap处于休眠状态,并且服务器与DataSource之间没有传输。
当不使用toolbar: ["create", "save"]
选项但仅使用toolbar: ["create"]
配置网格时,会出现此问题。我想实时发送更改。
var allUsersDataSource = new kendo.data.DataSource({
transport: {
read: {
url: API + "nk/getusers",
dataType: "json"
}
},
});
allUsersDataSource.fetch(function() {
allUsers = allUsersDataSource.data();
})
var assignedUsersDataSource = new kendo.data.DataSource({
transport: {
read:{
url: API+"nk/getassignedusers/"+documentId,
dataType: "json"
},
create: {
type: "POST",
url: API+"nk/addusertodocument",
dataType: "json"
},
update: {
type: "POST",
url: API+"nk/editusertodocument",
dataType: "json"
},
destroy:{
type: "POST",
url: API+"nk/removeuserdocument",
dataType: "json"
},
parameterMap: function(data, operation) {
console.log ("parameterMap");
if (operation === "destroy" ) {
console.log("!!!!!!!!!!!!!!!destroy", data.models)
}
if (operation === "create" && data.UserID) {
console.log("!!!!!!kendo.stringify(data.models)", kendo.stringify(data.models))
console.log ("parameterMap: data.models: ",data.models);
console.log("parameterMap: data.UserID: ", data.UserID)
console.log("parameterMap: documentId: ", documentId)
return {
models: kendo.stringify(data.models),
user_id: data.UserID,
document_id: documentId,
api_key: '1aa53f75-55c8-41a7-8554-25e094c71b47',
user: user
};
}
}
},
change: function(e) {
console.log("!!!!!!change: e.action:: " + e.action);
console.log("!!!!!!change: e.action:: ", e);
console.log("!!!!!!change: e.action:: ", e.models);
console.log("!!!!!!change: e.action:: ", e.UserID);
},
pageSize: 4,
schema: {
model: {
fields: {
UserName: { editable: false, nullable: true },
Surname: { editable: false, nullable: true },
UserID: { field: "UserID", defaultValue: 1 },
GroupName: { editable: false, nullable: true },
}
}
}
});
var _grid = $("\#grid-single-user-groups").kendoGrid({
dataSource: assignedUsersDataSource,
filterable: true,
scrollable: false,
// toolbar: ["create", "save"],
toolbar: ["create"],
pageable: true,
columns: [
{
field: "UserID", width: "100%",
editor: userDropDownEditor,
title: "Agent",
template: function(userID) {
for (var idx = 0, length = allUsers.length; idx < length; idx++) {
if (allUsers[idx].UserNameID == userID.UserID) {
return allUsers[idx].Login;
}
}
}
},
{ command: [ "destroy"], title: " ", width: "250px" }
],
editable: {mode: "incell"},
save: function(e) {
if (e.values.UserID !== "") {
if (e.values.UserID !== e.model.UserID) {
console.log("!!!UserID is modified");
}
} else {
e.preventDefault();
console.log("UserID cannot be empty");
}
if (e.values.UserName !== "") {
if (e.values.UserName !== e.model.UserName) {
console.log("!!!UserName is modified");
}
} else {
e.preventDefault();
console.log("UserName cannot be empty");
}
},
saveChanges: function(e) {
if (!confirm("Are you sure you want to save all changes?")) {
e.preventDefault();
}else{
console.log("!!!!confirmeddddddd", documentId)
$.ajax({
url: API+"nk/removeuserdocument",
type: 'POST',
dataType: "json",
data: {
api_key: '1aa53f75-55c8-41a7-8554-25e094c71b47',
user: user,
documentId: documentId
},
success : function(response) {
console.log("Pomyslnie usunięto wszystkich użytkowników.", response)
},
error: function(xhr, status, error) {
alert(xhr.responseText);
var err = eval("(" + xhr.responseText + ")");
console.log("NIE usunięto użytkowników.", err.Message)
}
});
}
},
remove: function(e) {
console.log("!!!!!Removing", e.model.UserID);
},
cellClose: function(e){
console.log('Closing Cell Edit e::', e);
console.log('Closing Cell Edit e.type::', e.type);
console.log('Closing Cell Edit e.container::', e.container);
console.log('Closing Cell Edit e.model::', e.model);
console.log('!!!! Closing Cell Edit e.model.UserID::', e.model.UserID);
console.log('Closing Cell Edit e.model.isNew()::', e.model.isNew());
console.log('Closing Cell Edit e.sender ::', e.sender );
e.container.find("input[name=id]")
}
});
function userDropDownEditor(container, options) {
$('<input data-bind="value:' + options.field + '"/>')
.appendTo(container)
.kendoDropDownList({
dataTextField: "Login",
dataValueField: "UserNameID",
filter: "contains",
dataSource: allUsersDataSource,
valuePrimitive:true,
select: function(e) {
if (e.item) {
var dataItem = this.dataItem(e.item);
console.log("event :: select (" + dataItem.Login + " : " + dataItem.UserNameID + ")");
} else {
console.log("nie jest dobrze");
}
}
})
}
如果为网格配置了选项保存:toolbar: ["create", "save"]
,并显示“保存更改”(针对网格中的所有更改),则单击此按钮将为网格中的每一行调用parameterMap,但我遇到了新问题:现在我需要删除与此网格相关的数据库数据并再次创建所有数据,这将导致一个问题:(在删除与网格相关的所有数据库数据之后),用于创建新行时,它向服务器(对于每个网格行)发送多个发布请求一方面,服务器在持久存储此新数据方面存在问题;例如,在具有3行的相同网格中,一次保存保存更改可保存1行,其他时间保存2行,另一时间保存3或0行。