这是我的主视图页面，我在其中显示了kendo网格以显示类别列表：
<script>
$(document).ready(function () {
$("#categories-grid").kendoGrid({
dataSource: {
type: "json",
transport: {
read: {
url: "@Html.Raw(Url.Action("categoriesList", "Admin"))",
type: "POST",
dataType: "json",
data: '',
}
},
schema: {
data: "Data",
total: "Total",
errors: "Errors"
},
error: function (e) {
display_kendoui_grid_error(e);
this.cancelChanges();
},
pageSize: 9,
serverPaging: true,
serverFiltering: true,
serverSorting: true
},
pageable: {
refresh: true,
pageSizes: [10, 20, 30]
},
editable: {
confirmation: false,
mode: "inline"
},
scrollable: false,
columns: [
{
field: "CategoryId",
title: "Action",
width: 10,
template: '<a title="Edit" href="/Admin/ViewCategoryDetails?categoryId=#=CategoryId#&categoryName=#=CategoryName#"><span class="k-icon k-edit"></span></a>'
},
{
field: "CategoryName",
title: "CategoryName",
width: 10
},
{
field: "CategoryId",
title: "Action",
width: 10,
//template: '<a class="delete" href="#"><span class="k-icon k-delete"></span></a>'
template: '<a href="/Admin/DeleteParentCategory"><span class="k-icon k-delete"></span></a>'
}]
});
});
</script>
@Html.Partial("DeleteParentCategory")
此脚本显示kendo grid.in kendo网格中所有类别的列表我有一个编辑按钮和删除按钮。
关于删除按钮我想要求用户确认删除类别。
下面的是我的删除链接：
template: '<a href="/Admin/DeleteParentCategory"><span class="k-icon k-delete"></span></a>'
现在我想在上面的删除操作链接上调用这些部分视图：
这是我的管理控制器操作：
[HttpGet]
public PartialViewResult DeleteParentCategory()
{
return PartialView("DeleteParentCategory");
}
在这个局部视图中我只是让我的模态弹出html代码css和js引用。
现在发生的事情是，当我的主视图显示时，还会显示此模式弹出消息，当我点击删除操作链接然后弹出窗口，但我的主视图无法显示。我的主视图网格在删除操作链接上丢失。
任何人都可以告诉我如何在我的网格显示???
上点击删除操作链接时只显示部分视图我是非常新的mvc.so伙计们，请你帮帮我???????????????
这是我的删除局部视图（模态弹出框设计）：
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Dialog - Modal confirmation</title>
<link rel="stylesheet" href=" http://code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">
<script src=" http://code.jquery.com/jquery-1.10.2.js"></script>
<script src=" http://code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
@*<link rel="stylesheet" href="/resources/demos/style.css">*@
<script>
$(function () {
$("#dialog-confirm").dialog({
resizable: false,
height: 140,
modal: true,
buttons: {
"Delete all items": function () {
$(this).dialog("close");
},
Cancel: function () {
$(this).dialog("close");
}
}
});
});
</script>
</head>
<body>
<div id="dialog-confirm" title="Empty the recycle bin?">
<p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>These items will be permanently deleted and cannot be recovered. Are you sure?</p>
</div>
<p>Sed vel diam id libero <a href="http://example.com">rutrum convallis</a>. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.</p>
</body>
</html>
答案 0 :(得分：0)
您的主视图就像这样
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">
<script src=" http://code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<script>
$(document).ready(function () {
$("#categories-grid").kendoGrid({
dataSource: {
type: "json",
transport: {
read: {
url: "@Html.Raw(Url.Action("categoriesList", "Admin"))",
type: "POST",
dataType: "json",
data: '',
}
},
schema: {
data: "Data",
total: "Total",
errors: "Errors"
},
error: function (e) {
display_kendoui_grid_error(e);
this.cancelChanges();
},
pageSize: 9,
serverPaging: true,
serverFiltering: true,
serverSorting: true
},
pageable: {
refresh: true,
pageSizes: [10, 20, 30]
},
editable: {
confirmation: false,
mode: "inline"
},
scrollable: false,
columns: [
{
field: "CategoryId",
title: "Action",
width: 10,
template: '<a title="Edit" href="/Admin/ViewCategoryDetails?categoryId=#=CategoryId#&categoryName=#=CategoryName#"><span class="k-icon k-edit"></span></a>'
},
{
field: "CategoryName",
title: "CategoryName",
width: 10
},
{
field: "CategoryId",
title: "Action",
width: 10,
template: '<a class="delete" onClick="myFunction(); return false;" href=""><span class="k-icon k-delete"></span></a>'
}]
});
});
function myFunction() {
$("#dialog-confirm").dialog({
resizable: false,
height: 190,
modal: true,
buttons: {
"Delete all items": function () {
$(this).dialog("close");
},
Cancel: function () {
$(this).dialog("close");
}
}
});
}
</script>
@Html.Partial("DeleteParentCategory")
和DeleteParentCategory部分视图就像这样
<div id="dialog-confirm" title="Empty the recycle bin?" style="display:none">
<p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;">
</span>These items will be permanently deleted and cannot be recovered. Are you sure?</p>
</div>