[英]How to make actionlink/url.action in kendo-ui grid
目前我在kendo-ui網格上的asp.net mvc5項目中工作...
我想知道是否可以在網格按鈕所在的網格中進行操作鏈接或url.action。
<script>
$(document).ready(function () {
var projectdata = "http://localhost:xxxx",
$("#grid").kendoGrid({
dataSource: dataSource,
pageable: true,
toolbar: ["create"],
scrollable: false,
sortable: true,
groupable: true,
columns: [
{ field: "Name", title: "Task Name", width: "170px" },
{ field: "Status", title: "Status", width: "110px" },
{ field: "IsActive", title: "Active", width: "50px" },
{ command: ["edit", "delete", "Setting", "Task"], title: " ", width: "150px" }
],
editable: "popup"
});
});
</script>
我必須在“命令”字段中更改“設置”,然后在其中放置操作鏈接或url.action。
如果您使用的是asp.net mvc,為什么不使用剃刀代碼?
這是一個例子,希望對您有所幫助
@(Html.Kendo().Grid<YourObject>()
.Name("grid")
.TableHtmlAttributes(new { style = "min-height: 331px;" })
.ToolBar(t => t.Create())
.Columns(columns =>
{
columns.Template(@<text></text>).ClientTemplate("<div style=\"text-align:center\">" +
"<a href=\"" + Url.Action("Test", new { id = "#=Id#"}) + "\"><i style=\"padding-right: 8px;\" title=\"Setting\" class=\"fa fa-pencil fa-lg\"></i></a>" +
"</div>").Width(60).Title("");
columns.Bound(c=>c.Id).Hidden(true);
columns.Bound(c=>c.Name);
columns.Bound(c => c.Status);
columns.Bound(c => c.IsActive).ClientTemplate("<div style=\"text-align:center\">" +
"# if(Active) {#" +
"yes" +
"#} else {#" +
"no" +
"#}#" +
"</div>").Width(15);
})
.Sortable()
.Filterable()
.Pageable()
.DataSource(dataSource => dataSource
.Ajax()
.Model(model => model.Id(m => m.Id))
.Read(read => read.Action("Read", "YourObject"))
)
).Filterable()
)
創建一個自定義命令模板:
<script id="command-template" type="text/x-kendo-template">
<a class="k-button k-grid-even" href=" @Html.ActionLink("Setting", "Home", "ProjectContr", new { orderId = id },null)">Even</a>
</script>
並將其添加為您的列的一部分
columns: [
{ field: "Name", title: "Task Name", width: "170px" },
{ field: "Status", title: "Status", width: "110px" },
{ field: "IsActive", title: "Active", width: "50px" },
{ command: ["edit", "delete", "Setting", "Task"], title: " ", width: "150px" },
{ template: kendo.template($("#command-template").html())}]
要知道,僅當代碼是cshtml文件的一部分時,這才有用,因為需要解析類似內容。 如果將鏈接分隔為js文件,則該鏈接將失敗。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.