0

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

.
.
.
<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或kendo有关吗?甚至有可能实现我想要的吗?问候,小号

4

2 回答 2

0

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

您正在使用在客户端上处理的 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>
于 2013-10-17T12:34:00.947 回答
0

Razor 代码在服务器端呈现,因此一旦加载页面,通过 JavaScript 提取的任何新的 Razor 代码都不会正确呈现。

但是有一些方法可以解决这个问题,一种选择是从服务器中提取模板,这样您就可以在视图关闭之前预渲染视图,然后让 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>

于 2013-10-17T12:40:49.473 回答