ASP.NET MVC Kendo Grid 如何从 javascript 调用控制器方法
ASP.NET MVC Kendo Grid how to call controller method from javascript
因为我有一个自定义模式确认弹出窗口,所以我需要从 javascript 调用方法 .Destroy("Remove", "Attachment")
。如何从 javascript 调用 Remove
方法?我在代码 how to call
中指出了我希望能够调用该方法的位置。还有,如何通过OrderViewModel
?
这是我的网格:
@(Html.Kendo().Grid<TelerikAspNetCoreApp7.Models.OrderViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(p => p.OrderID).Filterable(false);
columns.Bound(p => p.Freight);
columns.Bound(p => p.OrderDate).Format("{0:MM/dd/yyyy}");
columns.Bound(p => p.ShipName);
columns.Bound(p => p.ShipCity);
columns.Command(command =>
{
command.Custom("Destroy")
.Click("showDeleteConfirmation")
.HtmlAttributes(new { style = "width:40%" });
}).Width("15%");
})
.Pageable()
.Sortable()
.Scrollable()
.Filterable()
.HtmlAttributes(new { style = "height:550px;" })
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Destroy("Remove", "Attachment")
.Read(read => read.Action("Orders_Read", "Grid"))
.Destroy(read => read.Action("Orders_Read", "Grid"))
)
)
模态:
@(Html.Kendo()
.Dialog()
.Name("DeleteConfirmation")
.Modal(true)
.Title("Confirm Delete")
.Content("Are you sure you want to delete this item?")
.Visible(false)
.Actions(a =>
{
a.Add().Text("No").Action("cancelDelete");
a.Add().Text("Yes").Action("confirmDelete").Primary(true);
})
)
脚本:
<script>
var modelToDelete;
function showDeleteConfirmation(e) {
e.preventDefault();
var grid = $("#grid").data("kendoGrid");
var dialog = $('#DeleteConfirmation').data("kendoDialog");
modelToDelete = grid.dataItem($(e.target).parents('tr'));
dialog.content("Are you sure you want to delete this item with ID - " + modelToDelete.OrderID + "?");
dialog.open();
}
function confirmDelete(e) {
//how to call .Destroy("Remove", "Attachment") from here
}
function cancelDelete() {
}
</script>
控制器:
public ActionResult Remove([DataSourceRequest] DataSourceRequest request, OrderViewModel attachmentVm)
{
Attachment attachment = _db.Attachments.FirstOrDefault(o => o.Guid == attachmentVm.Guid);
attachment.IsActive = false;
attachment.LastUpdated = DateTime.Now;
attachment.LastUpdatedBy = _sessionUser.Username;
_db.SaveChanges();
return Json(ModelState.ToDataSourceResult());
}
答案如下:
function confirmDeleteAttach(e) {
$.ajax({
url: '/Attachment/Remove',
data: { Guid: modelToDeleteAttach.Guid },
type: "POST",
success: function () {
gridToDeleteAttach.dataSource.remove(modelToDeleteAttach);
$('#DeleteConfirmationAttach').data("kendoDialog").close();
}
});
}
因为我有一个自定义模式确认弹出窗口,所以我需要从 javascript 调用方法 .Destroy("Remove", "Attachment")
。如何从 javascript 调用 Remove
方法?我在代码 how to call
中指出了我希望能够调用该方法的位置。还有,如何通过OrderViewModel
?
这是我的网格:
@(Html.Kendo().Grid<TelerikAspNetCoreApp7.Models.OrderViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(p => p.OrderID).Filterable(false);
columns.Bound(p => p.Freight);
columns.Bound(p => p.OrderDate).Format("{0:MM/dd/yyyy}");
columns.Bound(p => p.ShipName);
columns.Bound(p => p.ShipCity);
columns.Command(command =>
{
command.Custom("Destroy")
.Click("showDeleteConfirmation")
.HtmlAttributes(new { style = "width:40%" });
}).Width("15%");
})
.Pageable()
.Sortable()
.Scrollable()
.Filterable()
.HtmlAttributes(new { style = "height:550px;" })
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Destroy("Remove", "Attachment")
.Read(read => read.Action("Orders_Read", "Grid"))
.Destroy(read => read.Action("Orders_Read", "Grid"))
)
)
模态:
@(Html.Kendo()
.Dialog()
.Name("DeleteConfirmation")
.Modal(true)
.Title("Confirm Delete")
.Content("Are you sure you want to delete this item?")
.Visible(false)
.Actions(a =>
{
a.Add().Text("No").Action("cancelDelete");
a.Add().Text("Yes").Action("confirmDelete").Primary(true);
})
)
脚本:
<script>
var modelToDelete;
function showDeleteConfirmation(e) {
e.preventDefault();
var grid = $("#grid").data("kendoGrid");
var dialog = $('#DeleteConfirmation').data("kendoDialog");
modelToDelete = grid.dataItem($(e.target).parents('tr'));
dialog.content("Are you sure you want to delete this item with ID - " + modelToDelete.OrderID + "?");
dialog.open();
}
function confirmDelete(e) {
//how to call .Destroy("Remove", "Attachment") from here
}
function cancelDelete() {
}
</script>
控制器:
public ActionResult Remove([DataSourceRequest] DataSourceRequest request, OrderViewModel attachmentVm)
{
Attachment attachment = _db.Attachments.FirstOrDefault(o => o.Guid == attachmentVm.Guid);
attachment.IsActive = false;
attachment.LastUpdated = DateTime.Now;
attachment.LastUpdatedBy = _sessionUser.Username;
_db.SaveChanges();
return Json(ModelState.ToDataSourceResult());
}
答案如下:
function confirmDeleteAttach(e) {
$.ajax({
url: '/Attachment/Remove',
data: { Guid: modelToDeleteAttach.Guid },
type: "POST",
success: function () {
gridToDeleteAttach.dataSource.remove(modelToDeleteAttach);
$('#DeleteConfirmationAttach').data("kendoDialog").close();
}
});
}