不幸的是，当我去从网格中删除一个项目但它没有正确更新时。
我尝试了三件事，但没有任何运气：
1。
$("#userListGrid").data("kendoGrid").dataSource.read;
$("#userListGrid").data("kendoGrid").refresh();
$('#userListGrid').data('kendoGrid').dataSource.read().then(function () {
$('#userListGrid').data('kendoGrid').refresh();
});
KendoGridRefresh();
以下是该函数的代码：
function KendoGridRefresh() {
var grid = $('#userListGrid').data('kendoGrid');
grid.dataSource.read();
}
这是网格的代码：
<div class="content-container">
<div class="container">
<h3 class="d-inline">Current Users</h3>
<button class="btn btn-primary d-inline mb-2 ml-5" onclick="window.location.href = '/user-maintenance/create-new-user'">Create New User</button>
<div class="row p-0 table-container striped">
<div id="userListGrid"></div>
</div>
</div>
<div id="delete-confirm-modal" style="background-color: white"></div>
</div>
<script type="text/javascript">
// Sticky header
function onDataBound() {
$("#loader-spinner").hide();
var wrapper = this.wrapper,
toolbar = wrapper.find(".k-grid-toolbar"), // e.g. button to export spreadsheet
groupingHeader = wrapper.find(".k-grouping-header"), // interactive tools
header = wrapper.find(".k-grid-header"); // column headers
function resizeFixed() {
var paddingRight = parseInt(toolbar.css("padding-right"));
toolbar.css("width", wrapper.width() - paddingRight - 3);
paddingRight = parseInt(groupingHeader.css("padding-right"));
groupingHeader.css("width", wrapper.width() - paddingRight - 3);
paddingRight = parseInt(header.css("padding-right"));
header.css("width", wrapper.width() - paddingRight);
}
function scrollFixed() {
var navbarHeaderHeight = 0;
if ($(".nav-side-menu").height() <= 100) { // On mobile device or small screen
navbarHeaderHeight = 0;
} else { // Full screen
navbarHeaderHeight = 100;
}
var offset = $(this).scrollTop(),
tableOffsetTop = wrapper.offset().top - navbarHeaderHeight;
if (offset < tableOffsetTop) {
toolbar.removeClass("fixed-header");
toolbar.removeAttr("style");
groupingHeader.removeClass("fixed-header");
groupingHeader.removeAttr("style");
header.removeClass("fixed-header");
header.removeAttr("style");
} else if (offset >= tableOffsetTop) {
toolbar.addClass("fixed-header");
toolbar.css("top", navbarHeaderHeight);
groupingHeader.addClass("fixed-header");
groupingHeader.css("top", navbarHeaderHeight + toolbar.outerHeight());
header.addClass("fixed-header");
header.css("top", navbarHeaderHeight + toolbar.outerHeight() + groupingHeader.outerHeight());
}
}
resizeFixed();
$(window).resize(resizeFixed);
$(window).resize(scrollFixed);
$(window).scroll(resizeFixed);
$(window).scroll(scrollFixed);
$(".content-container").scroll(resizeFixed);
$(".content-container").scroll(scrollFixed);
}
var externalId = "";
var firstName = "";
var lastName = "";
var emailAddress = "";
var confirmDelete = function (eid, firstN, lastN, emailA) {
var dialog = $("#delete-confirm-modal");
externalId = eid;
firstName = firstN;
lastName = lastN;
emailAddress = emailA;
if (dialog.data("kendoDialog")) {
dialog.data("kendoDialog").open();
} else {
dialog.kendoDialog({
width: "450px",
title: "Confirm delete",
closable: true,
modal: true,
content: "<p>Confirm that you wish to delete user " + firstName + " " + lastName + "(" + emailAddress + "). Once this is done, it cannot be reversed.</p>",
actions: [
{
text: "Cancel",
primary: true
}, {
text: "Confirm",
action: function (e) {
var url = "/apic/usermaintenance/deleteuser/" + externalId;
$.get(url,
function (data) {
//$("#userListGrid").data("kendoGrid").dataSource.read;
//$("#userListGrid").data("kendoGrid").refresh();
/*$('#userListGrid').data('kendoGrid').dataSource.read().then(function () {
$('#userListGrid').data('kendoGrid').refresh();
});*/
KendoGridRefresh();
kendo.alert("User has been deleted");
}).fail(function () {
kendo.alert("Unable to delete user. An error has occured. Please try again.");
});
}
}
],
close: onClose
});
}
};
var deleteUser = function () {
};
var onClose = function (e) {
externalId = "";
firstName = "";
lastName = "";
emailAddress = "";
};
function KendoGridRefresh() {
var grid = $('#userListGrid').data('kendoGrid');
grid.dataSource.read();
}
$(document).ready(function () {
var roles = [{
id: 1, name: "JB-Admin", key: 1, value: "JB-Admin"
}, {
id: 2, name: "M-Admin", key: 2, value: "M-Admin"
}, {
id: 3, name: "NM-Admin", key: 3, value: "NM-Admin"
}, {
id: 4, name: "Pricing", key: 4, value: "Pricing"
}, {
id: 5, name: "Orders", key: 5, value: "Orders"
}, {
id: 6, name: "Orders-U", key: 6, value: "Orders-U"
}, {
id: 7, name: "Contracts", key: 7, value: "Contracts"
}, {
id: 8, name: "Exchange", key: 8, value: "Exchange"
}, {
id: 9, name: "Destination", key: 9, value: "Destination"
}, {
id: 10, name: "Destination-C", key: 10, value: "Destination-C"
}, {
id: 11, name: "Nominations", key: 11, value: "Nominations"
}, {
id: 12, name: "Nominations-C", key: 12, value: "Nominations-C"
}, {
id: 13, name: "Nominations-U", key: 13, value: "Nominations-U"
}, {
id: 14, name: "Store", key: 14, value: "Store"
}, {
id: 15, name: "Retail Locator", key: 15, value: "Retail Locator"
}, {
id: 16, name: "Lessonly", key: 16, value: "Lessonly"
}, {
id: 17, name: "Inspection Form", key: 17, value: "Inspection Form"
}, {
id: 18, name: "Products", key: 18, value: "Products"
}, {
id: 19, name: "QA/QC", key: 19, value: "QA/QC"
}, {
id: 20, name: "Presentations", key: 20, value: "Presentations"
}, {
id: 21, name: "About Us", key: 21, value: "About Us"
}, {
id: 22, name: "Marketing", key: 22, value: "Marketing"
}, {
id: 23, name: "Marketing-C", key: 23, value: "Marketing-C"
}, {
id: 24, name: "Marketing-U", key: 24, value: "Marketing-U"
}, {
id: 25, name: "Marketing-D", key: 25, value: "Marketing-D"
}
];
$("#userListGrid").kendoGrid({
dataSource: {
transport: {
read: "/apic/usermaintenance/getmyusers",
dataType: "json"
},
schema: {
data: function (response) {
return response;
},
model: {
fields: {
UserId: { type: "string" },
ExternalId: { type: "string" },
EmailAddress: { type: "string" },
FirstName: { type: "string" },
LastName: { type: "string" },
Display: { type: "string" },
Company: { type: "string" },
AxAccountNumber: { type: "string" },
MemberType: { type: "string" },
AccessPricing: { type: "string" },
AccessOrders: { type: "string" },
AccessContracts: { type: "string" },
AccessExchange: { type: "string" },
AccessDestination: { type: "string" },
AccessNominations: { type: "string" },
AccessMarketingCalendar: { type: "string" },
AccessStore: { type: "string" },
AccessRetailLocator: { type: "string" },
AccessLessonly: { type: "string" },
AccessInspectionForm: { type: "string" },
AccessProductsList: { type: "string" },
AccessQaQc: { type: "string" },
AccessPresentations: { type: "string" },
AccessAboutUs: { type: "string" },
FilterString: { type: "string" }
}
}
},
pageSize: 20,
sort: { field: "AxAccountNumber", dir: "asc" }
},
dataBound: onDataBound,
dataBinding: function (arg) {
},
groupable: true,
sortable: true,
filterable: true,
pageable: {
refresh: true,
pageSizes: true,
buttonCount: 5
},
toolbar: ["search", "excel"],
excel: {
fileName: "UserList.xlsx",
allPages: true
},
refresh: {
reload: true
},
resizable: true,
columns: [
{
template: '<a href="/user-maintenance/edit-user?userId=#= ExternalId #"><div class="edit-icon" title="edit"></div></a>',
width: '30px'
},
{
field: "EmailAddress",
title: "Email Address",
filterable: {
multi: true,
search: true
}
}, {
template: "#= LastName #, #= FirstName #",
title: "Name",
field: "Display",
filterable: {
multi: true,
search: true
}
}, {
title: "Company",
field: "Company",
filterable: {
multi: true,
search: true
}
}, {
title: "Account Number",
field: "AxAccountNumber",
filterable: {
multi: true,
search: true
},
width: '90px'
}, {
template: kendo.template($("#user-rights-template").html()),
title: "Permissions",
field: "FilterString",
filterable: {
search: true
}
},
{
template: '<button class="btn btn-danger btn-sm" onclick="confirmDelete(\'#=ExternalId#\', \'#=FirstName#\', \'#=LastName#\', \'#=EmailAddress#\')" style="padding: .25rem;">X</button>',
width: '40px'
},
]
});
});
</script>
<script type="text/x-kendo-template" id="user-rights-template">
#if(MemberType==='JoeBlowAdmins') {#
<span class='badge badge-pill badge-info'>JB-Admin</span>
#}#
#if(MemberType==='JoeBlowUsers') {#
<span class='badge badge-pill badge-info'>JB-User</span>
#}#
#if(MemberType==='MemberAdmin') {#
<span class='badge badge-pill badge-info'>M-Admin</span>
#}#
#if(MemberType==='MemberUser') {#
<span class='badge badge-pill badge-info'>M-User</span>
#}#
#if(MemberType==='NonMemberAdmin') {#
<span class='badge badge-pill badge-info'>NM-Admin</span>
#}#
#if(MemberType==='NonMemberUser') {#
<span class='badge badge-pill badge-info'>NM-User</span>
#}#
#if(AccessPricing==='Read'){#
<span class='badge badge-pill badge-info'>Pricing</span>
#}#
#if(AccessOrders==='Read'){#
<span class='badge badge-pill badge-info'>Orders</span>
#}#
#if(AccessOrders==='Update'){#
<span class='badge badge-pill badge-info'>Orders-U</span>
#}#
#if(AccessContracts==='Read'){#
<span class='badge badge-pill badge-info'>Contracts</span>
#}#
#if(AccessExchange==='Read'){#
<span class='badge badge-pill badge-info'>Exchange</span>
#}#
#if(AccessDestination==='Read'){#
<span class='badge badge-pill badge-info'>Destination</span>
#}#
#if(AccessDestination==='Create'){#
<span class='badge badge-pill badge-info'>Destination-C</span>
#}#
#if(AccessNominations==='Read'){#
<span class='badge badge-pill badge-info'>Nominations</span>
#}#
#if(AccessNominations==='Create'){#
<span class='badge badge-pill badge-info'>Nominations-C</span>
#}#
#if(AccessNominations==='Update'){#
<span class='badge badge-pill badge-info'>Nominations-U</span>
#}#
#if(AccessMarketingCalendar==='Read'){#
<span class='badge badge-pill badge-info'>Marketing</span>
#}#
#if(AccessMarketingCalendar==='Create'){#
<span class='badge badge-pill badge-info'>Marketing-C</span>
#}#
#if(AccessMarketingCalendar==='Update'){#
<span class='badge badge-pill badge-info'>Marketing-U</span>
#}#
#if(AccessMarketingCalendar==='Delete'){#
<span class='badge badge-pill badge-info'>Marketing-D</span>
#}#
#if(AccessStore==='Read'){#
<span class='badge badge-pill badge-info'>Store</span>
#}#
#if(AccessRetailLocator==='Read'){#
<span class='badge badge-pill badge-info'>Retail Locator</span>
#}#
#if(AccessLessonly==='Read'){#
<span class='badge badge-pill badge-info'>Lessonly</span>
#}#
#if(AccessInspectionForm==='Read'){#
<span class='badge badge-pill badge-info'>Inspection Form</span>
#}#
#if(AccessProductsList==='Read'){#
<span class='badge badge-pill badge-info'>Products</span>
#}#
#if(AccessQaQc==='Read'){#
<span class='badge badge-pill badge-info'>QA/QC</span>
#}#
#if(AccessPresentations==='Read'){#
<span class='badge badge-pill badge-info'>Presentations</span>
#}#
#if(AccessAboutUs==='Read'){#
<span class='badge badge-pill badge-info'>About Us</span>
#}#
</script>
有人可以告诉我我可能做错了吗？
答案 0 :(得分：0)
如果仅删除一行，则无需再次读取整个数据集 您可以调用数据源的remove（）方法：
https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/methods/remove
dataSource.remove(dataItem);
同意来自G_P的评论-调用可能无法访问您的API。检查控制台以获取错误消息和/或API调用的响应。