我正在 MVC 视图上为剑道 ui 网格创建上下文菜单。上下文菜单将包含 Add、Edit、Delete li 项。单击添加选项将打开 mvc razor 视图作为模式。编辑和删除也是如此。我知道 kendo 提供 kendo.window 以模式打开。我如何从上下文菜单中调用它。我是否需要在局部视图中创建模态窗口或 kendo.Window。有人可以分享一个相关的例子,以便我得到一些指导。我看到的最接近的例子是使用 Kendo MVC 控件。我正在寻找使用 kendoui jquery 的示例。
看法
@Html.Partial("~/Views/Admin/_AdminMenu.cshtml");
<div id="grid" class="grids"></div>
<div id="accessDiv" style=" width 100%; height 100%; background-color #fff;">
<label>Enter access key</label>
<input type="text" />
<input type="button" title="Enter" value="Enter" />
</div>
<ul id="contextMenu">
<li>Add</li>
<li class="k-separator"></li>
<li>Edit</li>
<li class="k-separator"></li>
<li>Delete</li>
</ul>
@section scripts{
<script>
$(document).ready(function () {
var requests = [
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ranjit Ravindranath Menon", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ranjit Ravindranath Menon", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" },
{ requestId: "337", activity: "Set Up Billing", team: "Charge Maint", priority: "x", customer: "Audi", custId: "25897895", primeBL: "WP", salesOffice: "3100", createdDate: "14/02/2017", requiredBy: "18/02/2017", createdBy: "Ralf Klein", withName: "Ingri Schmidt", status: "Complete" }
];
var requestDataSource = new kendo.data.DataSource({ data: requests, pageSize: 20, sort: { field: "requestId", dir: "asc" } });
requestDataSource.read();
$("#grid").kendoGrid({
dataSource: requestDataSource,
columns: [
{ field: "requestId", title: "Request", width:"110px" },
{ field: "activity", title: "Activity", width: "110px" },
{ field: "team", title: "Team", width: "110px" },
{ field: "priority", title: "Priority", width: "110px" },
{ field: "customer", title: "Customer", width: "130px" },
{ field: "custId", title: "Cust ID", width: "120px" },
{ field: "primeBL", title: "Prim BL", width: "120px" },
{ field: "salesOffice", title: "Sales Office", width: "140px" },
{ field: "createdDate",title: "Created", width: "120px" },
{ field: "requiredBy", title: "Required By", width: "140px" },
{ field: "createdBy", title: "Created By", width: "140px" },
{ field: "withName", title: "With", width: "110px" },
{ field: "status", title: "Status", width: "100px" }
//{ command: ["edit", "destroy"], width: "250px" }
],
scrollabe:false,
pageable: true,
sortable:true,
//groupable: true,
filterable: true,
editable: "inline",
reorderable: true
});
$("#contextMenu").kendoContextMenu({
target: "#grid",
alignToAnchor: false
});
var accessWindow = $("#accessDiv").kendoWindow({
actions: {}, /*from Vlad's answer*/
draggable: true,
height: "300px",
modal: true,
resizable: false,
title: "Access",
width: "500px",
visible: false /*don't show it yet*/
}).data("kendoWindow").center().open();
accessWindow.data("kendoWindow").center();
accessWindow.data("kendoWindow").open();
});
</script>
}