如何使用剃刀语法在剑道网格列模板中调用 javascript 函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21634270/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to call a javascript function inside kendo grid column template with razor syntax
提问by tomc
I have implemented a Kendo Grid with MVC4 and Razor syntax. This grid displays log entries from a database table. The LogText column contains text with Windows newline characters. I am trying to replace those newline characters with line break tags. To do this, I have created a javascript function that I am wanting to call from a column template. The grid uses server binding. I cannot seem to find the correct syntax to make a javascript call from within the template. I have seen many examples, but none seem to be with the Razor syntax. I hope someone can help me with this.
我已经用 MVC4 和 Razor 语法实现了一个 Kendo Grid。此网格显示数据库表中的日志条目。LogText 列包含带有 Windows 换行符的文本。我正在尝试用换行符标签替换这些换行符。为此，我创建了一个想要从列模板调用的 javascript 函数。网格使用服务器绑定。我似乎找不到从模板中进行 javascript 调用的正确语法。我看过很多例子，但似乎没有一个与 Razor 语法有关。我希望有人能帮我解决这个问题。
Here is my code:
这是我的代码：
@model IEnumerable<Core.Models.ShipmentLog>
@{
ViewBag.Title = "ShipmentLog";
}
<h2>ShipmentLog</h2>
@(Html.Kendo().Grid(Model)
.Name("ShipmentLogGrid")
.Columns(columns=>
{
columns.Bound(bl => bl.UserName);
columns.Bound(bl => bl.LogTime);
columns.Bound(bl => bl.LogType);
columns.Bound(bl => bl.LogText).Width(600).Encoded(false).Template(#= GetHtmlNewLinesString(@item.LogText) #);
})
)
<div>
@Html.ActionLink("Back to List", "Index")
</div>
<script type="text/javascript">
function getHtmlNewLinesString(text) {
return text.replace('\n/g', '<br />');
}
</script>
采纳答案by David
This can be achieved without javascript, but for learning on how to use templates refer to @C Sharper's answer.
这可以在没有 javascript 的情况下实现，但要了解如何使用模板，请参阅@C Sharper 的答案。
columns.Bound(bl => bl.LogText)
.Template(@<text>@item.LogText.Replace(System.Environment.NewLine, "<br />"))
.Width(600)
.Encoded(false);
回答by CSharper
@(Html.Kendo().Grid(Model)
.Name("Details")
.Columns(columns =>
{
columns.Bound(m => m.SubSystemOrderId).Title("Subsys #");
columns.Bound(m => m.Description).Title("Description").Template(@<text><a href="javascript: void(0);" onclick="return window.top.DisplayExternalOrderDetails('@item.SubSystemOrderId', '@item.OrderDetailTypeId', '@item.ProposalId', '@ViewBag.MyOpExUser', '@ViewBag.selectedOpportunityId')">@item.Description</a></text>);
columns.Bound(m => m.SubSystemStatusName).Title("Status");
columns.Bound(m => m.GrossRevenue).Title("Gross Revenue").Format("{0:c}");
columns.Bound(m => m.IncludeInForecast).Title("Include In Forecast").Template(m=>m.IncludeInForecast ? "Yes" : "No");
columns.Bound(m => m.ProposalId).Title("Proposal Id").Visible(false);
})
)
another example
另一个例子
columns.Bound(m => m.OpportunityName).Title("Opportunity Name").ClientTemplate("<a href='javascript: void(0);' onclick=\"return openMSDynamicsWindow('#= OpportunityUrl #');\">#= OpportunityName #</a>").HtmlAttributes(new { @class = "k-link" });
You'll see im passing into the function '#= OpportunityUrl #'. That's how you can grab values off of the model.
#= OpportunityName #will be the the link text.
你会看到 im 传入函数'#= OpportunityUrl #'。这就是您可以从模型中获取值的方法。
#= OpportunityName #将是链接文本。
This is a more Complex example, you can really do anything you want. Just getting the string based crap to work is a real pain
这是一个更复杂的例子，你真的可以做任何你想做的事。只是让基于字符串的废话工作真的很痛苦
columns.Bound(m => m.Dollars).Title("").ClientTemplate(
"# if (Dollars == null) { #" +
"" +
"# } else if (Dollars == 0) { #" +
"<div>#= kendo.toString(Dollars, 'c') #</div>" +
"# } else if (Count > 0) { #" +
"<a href='javascript: void(0);' onclick=\"return window.top.openOrderDetails('#= Count #','#= Type #','#= DetailId #','#= OrderId #','#= User #','#= SelectedId #');\">#= kendo.toString(Dollars, 'c') #</a>" +
"# } #"
)
回答by Deathstalker
This may be helpful to someone. Im using this to build a unique id inside the textbox. In addition to that you could easily write in an onclick or on blur event. Then just pass in with it the element ID.
这可能对某人有帮助。我使用它在文本框中构建一个唯一的 id。除此之外，您可以轻松地编写 onclick 或 on blur 事件。然后只需传入元素 ID。
Html.Kendo().Grid((List<RadCarePlus.V2.Web.Models.Facilities>) ViewData["FacilitiesList"])
.Name("Facilities")
.Columns(columns =>
{ int i = 0;
columns.Bound(c => c.ProviderID).Title("Provider Number").Width(150).HtmlAttributes(new { style = "text-align:center; white-space: nowrap;" }).HeaderHtmlAttributes(new { style = "text-align:center; white-space: nowrap;" });
columns.Bound(c => c.NPI).Title("NPI").Width(150).HtmlAttributes(new { style = "text-align:center; white-space: nowrap;" }).HeaderHtmlAttributes(new { style = "text-align:center; white-space: nowrap;" });
columns.Bound(c => c.ProviderFirstName).Template(c => c.ProviderFirstName + " " + c.ProviderLastName).Title("Provider Name").Width(140).HtmlAttributes(new { style = "text-align:center; white-space: nowrap; text-decoration: underline;" }).HeaderHtmlAttributes(new { style = "text-align:center; white-space: nowrap;" });
columns.Bound(c => c.AddressLine1).Template(c => c.AddressLine1 + " " + c.AddressLine2 + "<BR>" + c.City + " " + c.State + " " + c.Zipcode).Title("Address").Width(140).HtmlAttributes(new { style = "text-align:left; white-space: nowrap;" }).HeaderHtmlAttributes(new { style = "text-align:left; white-space: nowrap;" });
columns.Bound(c => c.Email).Template(c => "<input type='text' name='AdminEmail' id='" + (i = i + 1) + "' value='" + c.Email + "'> ").Title("Administrator").Width(140).HtmlAttributes(new { style = "text-align:center; white-space: nowrap; text-decoration: underline;" }).HeaderHtmlAttributes(new { style = "text-align:center; white-space: nowrap;" });
})
.Sortable(sortable => sortable.AllowUnsort(false))
.DataSource(dataSource => dataSource.Server().PageSize(5)
)
