首页 > 解决方案 > 如何从 Kendo.Grid 的 ClientTemplate 内部向 JavaScript 函数发送参数?

问题描述

我的视图有一个 Kendo Grid,其中一个 ClientTemplate 以下列方式为列定义:

.ClientTemplate("<button type ='button' class='k-button btn-icon-sm btn-view-detail' id='btnTicketDetail'  onclick='showDetails(this)'><span class='k-icon k-i-file-txt'></span></button>#=data.TicketId#");

上面的代码调用了 JavaScript 函数showDetails

此函数与 Kendo Grid 在同一视图中定义:

function showDetails(e) {
    var grid = $("#VarianceTicket").data("kendoGrid");
    var row = $(e).closest("tr");
    var rowIdx = $("tr", grid.tbody).index(row);
    var item = grid.dataItem(row);
    var ticketDetailsUrl = "@Url.Action("Index", "VarianceTicketDetail", new System.Web.Routing.RouteValueDictionary(new { id = "data" }), Request.Url.Scheme)".replace("data", item.TicketId);
    var newURL = ticketDetailsUrl;
    window.open(newURL, '_blank');
}

现在,我需要将该函数移动到一个公共Site.js文件中。

当我这样做时,函数中的以下行不正确:

var ticketDetailsUrl = "@Url.Action("Index", "VarianceTicketDetail", new System.Web.Routing.RouteValueDictionary(new { id = "data" }), Request.Url.Scheme)".replace("data", item.TicketId);

这就是它的样子:

在此处输入图像描述

基本上,正如我所见,它无法构建@Url.Action字符串。

我应该怎么做才能确保它有效?

标签: asp.net-mvc-4model-view-controllerkendo-uiurl-action

解决方案


您可以更改 showDetails 方法以接受 url 作为参数,并更新您的 ClientTemplate 以使用 @Url.Action 传递该参数。像这样:

ShowDetails 方法:

function showDetails(e, url) {
    var grid = $("#VarianceTicket").data("kendoGrid");
    var row = $(e).closest("tr");
    var rowIdx = $("tr", grid.tbody).index(row);
    var item = grid.dataItem(row);
    var ticketDetailsUrl = url;
    var newURL = ticketDetailsUrl;
    window.open(newURL, '_blank');
}

ClientTemplate(使用字符串连接并添加空行以提高可读性,格式可能需要调整,我现在无法在本地测试):

.ClientTemplate("<button type ='button' class='k-button btn-icon-sm btn-view-detail' id='btnTicketDetail'  onclick='showDetails(this, " + 

Url.Action("Index", "VarianceTicketDetail", new System.Web.Routing.RouteValueDictionary(new { id = "data" }), Request.Url.Scheme)".replace("data", #=data.TicketId#) +

")'><span class='k-icon k-i-file-txt'></span></button>#=data.TicketId#");

我已将 ClientTemplate 更改为以下逻辑: .ClientTemplate("<button type ='button' class='k-button btn-icon-sm btn-view-detail' id='btnTicketDetail' onclick='showDetails(this, " + Url.Action("Index", "VarianceTicketDetail", new System.Web.Routing.RouteValueDictionary(new { id = "data" }), Request.Url.Scheme) + ")'><span class='k-icon k-i-file-txt'></span></button>#=data.TicketId#");

我将替换函数data内部的部分showDetails


推荐阅读