剑道 UI 数据源未触发传输:创建
本文关键字:传输 创建 UI 数据源 剑道 | 更新日期: 2023-09-27 18:35:28
我有2个kendoUI网格从Web服务执行CRUD操作。出于某种原因,读取命令工作完美并填充我的网格。但是创建不会在 UserEventGrid() 方法中触发。这是我目前的情况。我有一个首先显示的网格。当我单击"添加"时,当我从该网格中选择一个项目时,它会打开一个包含所选行的窗口。那有a 添加按钮。现在,当我单击此添加传输:未触发创建时。
UserEventGrid() 这是主网格[第一个网格]。这有addentry按钮(它触发addEntry(e))namesListGrid() 这是单击查找后填充的第二个网格。在新窗口中选择行后,它具有添加按钮。(它触发add(dataItem)和相应的传输。来了问题。它不会触发传输创建。
下面是我的代码。
function UserEventGrid() {
userDS = new kendo.data.DataSource({
type: "json",
schema: {
data: function (response) {
return JSON.parse(response.d);
},
model: {
id: "UserId",
fields: {
UserId: { editable: false, nullable: false, type: "string" },
FirstName: { editable: true, nullable: true, type: "string" },
LastName: { editable: true, nullable: true, type: "string" },
},
},
transport: {
read: {
url: "/Services/Services.asmx/getUsers",
contentType: "application/json; charset=utf-8",
type: "POST",
},
create: {
url: "/Services/Services.asmx/AddUsers",
contentType: "application/json; charset=utf-8",
type: "POST",
datatype: "json"
},
update: {
url: "/Services/Services.asmx/UpdateUsers",
contentType: "application/json; charset=utf-8",
type: "POST",
datatype: "json"
},
destroy: {
url: "/Services/Services.asmx/DeleteUsers",
contentType: "application/json; charset=utf-8",
type: "POST",
datatype: "json"
},
parameterMap: function (data, type) {
if ((type == "update") || (type == "create") || (type == "destroy")) {
console.log('parameterMap: data => ' + JSON.stringify(data));
return JSON.stringify({ "erpUserJson": data });
} else {
return data;
}
}
}
});
userGrid = $("#user-event-grid").kendoGrid({
dataSource: userDS,
height: 450,
pageable: false,
sortable: true,
autosync: true,
binding: true,
columns: [
{
field: "Active",
title: "Active",
headerTemplate: '<span class="tbl-hdr">Active</span>',
template: '<input type="checkbox" #= Active ? "checked=checked" : "" # disabled="disabled" ></input>',
attributes: {
style: "vertical-align: top; text-align: left; font-weight:bold; font-size: 12px"
},
width: 65
},
{
field: "FirstName",
title: "FirstName",
headerTemplate: '<span class="tbl-hdr">FirstName</span>',
attributes: {
style: "vertical-align: top; text-align: left; font-weight:bold; font-size: 12px"
}
},
{
field: "LastName",
title: "LastName",
headerTemplate: '<span class="tbl-hdr">LastName</span>',
attributes: {
style: "vertical-align: top; text-align: left; font-weight:bold; font-size: 12px"
}
},
,
{
command: [
{
name: "destroy",
template: "<div class='k-button delete-btn'><span class='k-icon k-delete'></span></div>",
text: "remove"
},
{
text: "Edit",
template: "<div class='k-button edit-btn'><span class='k-icon k-edit'></span></div>",
click: editEntry
},
],
width: 90,
attributes: {
style: "vertical-align: top; text-align: center;"
}
},
],
editable: "popup"
}).data('kendoGrid');
}
function namesListGrid() {
nameDS = new kendo.data.DataSource({
type: "json",
schema: {
data: function (response) {
return JSON.parse(response.d);
},
model: {
id: "Z_CIM_WRK_ID",
fields: {
Z_NAMEFIRST: { editable: false, nullable: false, type: "string" },
Z_NAMELAST: { editable: false, nullable: true, type: "string" },
EMAILID: { editable: false, nullable: true, type: "string" },
}
},
},
transport: {
read: {
url: "/Services/Services.asmx/getNames",
contentType: "application/json; charset=utf-8",
type: "POST",
datatype: "json",
data: getSearchCriteria()
},
parameterMap: function (data, type) {
if ((type == "read") || (type == "create") || (type == "destroy")) {
console.log("parametermap => " + JSON.stringify(data));
return JSON.stringify(data);
} else {
return data;
}
}
}
});
namesGrid = $("#second").kendoGrid({
dataSource: nameDS,
height: 450,
pageable: false,
sortable: true,
binding: true,
selectable: "row",
serverFiltering: true,
autoSync: true,
columns: [
{
field: "Z_EID",
title: "ID",
headerTemplate: '<span class="tbl-hdr">ID</span>',
attributes: {
style: "vertical-align: top; text-align: left; font-weight:bold; font-size: 12px"
}
},
{
field: "Z_NAMELAST",
title: "ZNAMELAST",
headerTemplate: '<span class="tbl-hdr">ZNAMELAST</span>',
attributes: {
style: "vertical-align: top; text-align: left; font-weight:bold; font-size: 12px"
}
},
{
field: "Z_NAMEFIRST",
title: "ZNAMEFIRST",
headerTemplate: '<span class="tbl-hdr">ZNAMEFIRST</span>',
attributes: {
style: "vertical-align: top; text-align: left; font-weight:bold; font-size: 12px"
}
},
],
change: function (e) {
var dataItem = this.dataItem(this.select());
$("#third").hide(true);
$("#second").hide(true);
$("#first").show(true);
$("#gtable").show(true);
add(dataItem);
}
}).data('kendoGrid');
}
function add(dataItem) {
console.log(JSON.stringify(dataItem));
var model = {
"UserId": dataItem.Z_EID,
"FirstName": dataItem.Z_NAMEFIRST,
"LastName": dataItem.Z_NAMELAST,
"Group": "OPS",
"EmailAddr": dataItem.EMAILID,
"MobilePhone": dataItem.PHONE,
};
var viewModel = kendo.observable({
data: model,
isAddMode: true,
isLookupMode:false,
isEditMode: false,
groups: userGroups,
closeWin: function (dataItem) {
console.log('data => ' + JSON.stringify(this.data));
console.log("BEFORE => " + JSON.stringify(userDS.data()));
userDS.add(this.data);
userDS.sync();
var editWin = $("#window");
editWin.data("kendoWindow").close();
},
});
kendo.bind($("#edit-win"), viewModel);
$("#palette").html('');
$("#palette").append('<div id="palette-widget"></div>');
$('#window').data("kendoWindow").center().open();
}
function addEntry(e) {
var model = {
"UserId": "",
"FirstName": '',
"LastName": '',
};
var viewModel = kendo.observable({
data: model,
isAddMode: false,
isLookupMode:true,
isEditMode: false,
filterable:true,
groups: userGroups,
closeWin: function (e) {
console.log('data => ' + JSON.stringify(this.data));
userDS.add(this.data);
var editWin = $("#window");
editWin.data("kendoWindow").close();
e.preventDefault();
},
LookupWin: function (e) {
namesListGrid();
},
});
kendo.bind($("#edit-win"), viewModel);
$("#palette").html('');
$("#palette").append('<div id="palette-widget"></div>');
$('#window').data("kendoWindow").center().open();
}
在 addEntry
函数中,您可以像这样将数据添加到数据源:
userDS.add(this.data);
但是,您永远不会调用userDS.sync()
(您在 add
函数中执行此操作,但不在 addEntry
中执行此操作)。 您确实将 autosync
属性设置为 true,这将触发创建事件,但不是在userDS
数据源上执行此操作,而是在 userGrid
上执行此操作。 您可以在userDS
数据源中将autosync
设置为 true,也可以在userDS.add
之后调用userDS.sync()
。