从 ${xxx} 获取价值到操作链接中

本文关键字：操作 链接 获取 xxx | 更新日期: 2023-09-27 18:35:56

在这个项目中，我们的一位程序员编写了这段代码。

.
.
.
<script type="text/javascript">
 $(document).ready(function () {
     var dataSource = new kendo.data.DataSource({
         schema: {
             data: "Data",
             total: "Total"
         },
         transport: {
             read: {
                 url: '@Url.Action("List", "Customer")',
                 dataType: "json",
                 type: "POST"
             }
         },
         pageSize: 10,
         serverPaging: true,
         serverFiltering: true,
         serverSorting: true
     });
     $("#listView").kendoListView({
         dataSource: dataSource,
         pageable: true,
         template: kendo.template($("#customerTemplate").html())
     });
     $(".pager").kendoPager({
         dataSource: dataSource
     });
 });


<script type="text/x-kendo-tmpl" id="customerTemplate">
<article>
    **<h3>${CustomerNumber} <a href="Customer/Details/${CustomerNumber}">${FullName}</a></h3>
    ***<h3>${CustomerNumber} @Html.ActionLink(${CustomerNumber}, "Details", "Customer", new {id=${CustomerNumber}}, null)</h3>
    <div class="details">
        <span class="phone" itemprop="telephone"><a href="tel:${Phone}">${Phone}</a></span>
        <span class="email">${Email}</span>
    </div>
    <div class="clearfix"></div>
</article>

如果你看看两颗星星在哪里，那就是原始代码。我现在的任务是以某种方式将该代码转换为工作代码，就像三颗星所在的代码一样。但是，无论我怎么尝试，我都无法从jquery事物（${CustomerNumber}，${FullName}）中获取值并进入actionlink。我几乎无法理解这一点（新手，只有三个月的MVC），所以如果可以的话，请尽量让我保持简单。

我实际上试图将此代码放在文章标签所在的位置，并将其称为@fullname无济于事。

@string fullname = ${FullName}
我

试图搜索SO和Google，但老实说，我什至不知道如何提出这个问题。这与jquery或剑道有关吗？甚至有可能实现我想要的吗？问候， S

从 ${xxx} 获取价值到操作链接中

Razor 代码在服务器端呈现，因此一旦页面加载，通过 JavaScript 提取的任何新剃刀代码都将无法正确呈现。

不过，有一些方法可以解决这个问题，一种选择是从服务器中提取模板，这样您就可以在视图下降之前预渲染视图，然后让 Kendo 进行映射。

但是，如果你想把它全部保留在客户端，你可以有一个JS帮助程序方法，它在页面加载期间呈现，你可以在其中运行剃刀代码，例如

<script type="text/javascript">
    $(document).ready(function () {
        function getCustomerUrl(linkText, customerNumber) {
            var urlTemplate = '@Html.ActionLink("linkText", "Details", "Customer", new { id="customerNumber" }, null)';
            return urlTemplate.replace('linkText', linkText).replace('customerNumber', customerNumber);
        }
        ...
    });
</script>

然后在您的模板中，只需使用相关参数调用该方法，即

<script type="text/x-kendo-tmpl" id="customerTemplate">
<article>
    <h3>#= getCustomerUrl(FullName, CustomerNumber) #</h3>
    <div class="details">
        <span class="phone" itemprop="telephone"><a href="tel:${Phone}">${Phone}</a></span>
        <span class="email">${Email}</span>
    </div>
<div class="clearfix"></div>

缺点是你不能做你想做的事情。要记住的一件事是，在视图中编写的所有代码都是在服务器上处理的。

您正在使用在客户端上处理的javascript。它没有显示的原因是您的模板不知道@Html.ActionLink(${CustomerNumber}, "Details", "Customer", new {id=${CustomerNumber}}, null)是什么。所以你有点不匹配。

我要提出的问题是，如果这有效，为什么你需要改变它？

根据评论进行更新

我会建议这个 

<script type="text/javascript">
$(document).ready(function () {
    var url = @Html.Action("Details", "Customer");
    ...
});

然后在您的模板中这个

<h3>${CustomerNumber} <a href="url + '/' + ${CustomerNumber}">${FullName}</a></h3>
相关文章：