Question

我在MVC4 RAZOR 视图项目中有以下jQuery代码。当我对url进行硬编码时，call to action方法正常工作。但是当我使用Url.Action时，它不起作用。

硬编码方法的结果：http://localhost:64994/Search/GetCostpages/?costPageNumber=111

来自Url.Action方法的结果：http://localhost:64994/@Url.Action(%22Search%22,%20%22GetCostpages%22)?costPageNumber=111

为了使其有效，需要纠正什么？

$(function ()
{
    $("#btnCostPageNumberMagnifingLens").click(function ()
    {

        var costPageNumber = $("#txtCostPageNumber").val();

        //$.getJSON('/Search/GetCostpages/',{costPageNumber: costPageNumber},

        $.getJSON('@Url.Action("Search", "GetCostpages")',{costPageNumber: costPageNumber},
                            function (data) 
                            {

                             alert('Inside Function');

                             });
    });
});

Answer 1

您不能在单独的javascript文件中使用服务器端帮助程序。您可以使用DOM中的url。例如，这里有一些不引人注意的AJAXified btnCostPageNumberMagnifingLens元素。

因此，您可以在此按钮上使用HTML5 data- *属性来放置所需的URL：

<input type="button" id="btnCostPageNumberMagnifingLens" data-url="@Url.Action("Search", "GetCostpages")" value="some button" />

然后在您单独的javascript文件中，只需从DOM中读取它并将其用于您的AJAX请求：

$(function () {
    $('#btnCostPageNumberMagnifingLens').click(function () {
        var costPageNumber = $('#txtCostPageNumber').val();
        var url = $(this).data('url');
        $.getJSON(url, { costPageNumber: costPageNumber }, function (data) {
            alert('Inside Function');
        });
    });
});

Answer 2

Javascript没有Url助手的概念，因此getJSON方法将@Url.Action("Search", "GetCostpages")作为字符串接收，然后对其进行编码，从而产生您最终得到的奇怪网址。

只要此脚本在视图中（不在单独的脚本文件中），您需要做的就是从Url.Action方法中删除引号，并且razor会知道这是一个Url帮助程序，而不是字符串。

Answer 3

Darin指出了HTML5数据属性方法..这是一个很好的方法

然而，我使用隐藏场方法，因为我认为它更加不突兀..

jQuery

    var genericUrl = $('.hiddenUrl').val();
    var lastIndex = genericUrl.lastIndexOf("/") + 1;
    var urlFirstPart = genericUrl.substring(0, lastIndex);

    $("#btnCostPageNumberMagnifingLens").click(function () {

        var url = urlFirstPart + 'GetCostpages/';

    });

<强> HTML

<div class="loader">
    @Html.Hidden("hiddenUrlName", Url.Action("Action", "Search"), new { @class = "hiddenUrl" })
</div>

获取应用根源 - 另一种方法

<script type="text/javascript">
  var appRoot = '@this.Request.ApplicationPath';
</script>

Answer 4

如果将view和Js文件组合在视图中，则此方法应该有效。

Url.Action不适用于getJSON

4 个答案: