在 MVC5 中使用 Action 执行 ajax 调用

Question

我知道这是一个常见问题，对于类似的要求已经回答了很多次，但我在我的场景中找不到解决方法。

我正在使用 DevExpress MVC 组件。有一个类似如下的树视图：

@Html.DevExpress().TreeView(settings =>
{
    settings.Name = "NavigationClientsList";
    settings.AllowSelectNode = true;
    Model.ForEach(_client =>
    {
        settings.Nodes.Add(node =>
        {
            node.Name = String.Format("{0}_client_{1}", settings.Name, _client.ClientID);
            node.Text = _client.ClientName;
        });
    });

    settings.ClientSideEvents.NodeClick = "OnTreeViewNodeClick";

    settings.PreRender = (source, e) =>
    {
        ASPxTreeView treeView = (ASPxTreeView)source;
        treeView.ExpandAll();
    };
}).GetHtml()

还有我的 NodeClick 事件：

function OnTreeViewNodeClick(s, e) {
    if (e.node.name.indexOf("_client_") > -1) {
        var tmpDivDescription = e.node.name.split("_");
        if (tmpDivDescription.length = 3) {
            var tmpID = tmpDivDescription[2];
            //alert(tmpID);
            //$("#testDisplay").text("ALGO");
            $.ajax({
                url: 'Home/Client/',//'@Url.Action("Client", "Home")',//'Home/Client/25',//'@Url.Action("Client", "Home")',
                data: { 'id': tmpID },
                dataType: "html",
                success: function (result) {
                    //alert('OK!')
                    $("#DataDisplay").html(result);
                },
                error: function (xhr) { alert('ERROR!' + xhr.responseText) }
            });
        }

    } else {

    }
}

我尝试了几种两种方式来执行 Ajax 调用

url: 'Home/Client/' 和 url: '@Url.Action("Client", "Home")'

第一个按预期工作，但是当尝试将第二个与 UrlAction 一起使用时，服务器抱怨找不到资源：

Beschreibung：HTTP 404。Die gesuchte Ressource oder eine ihrer Abhängigkeiten wurde möglicherweise entfernt, umbenannt oder ist vorübergehend nicht verfügbar。 Überprüfen Sie folgende URL, und stellen Sie sicher, dass sie richtig geschrieben wurde。

Angeforderter URL：/@Url.Action("Client", "Home")

如您所见，请求的 URL 添加了一个“/”。我不知道这是否是我的问题的原因。

对于我找到的所有主题和资源，它们都使用“正常”的 Url.Action 格式。

有什么想法吗？

Answer 1

您不能在外部 js 文件中使用 Razor 语法。相反，您必须使用其中任何一个...

1. 您尝试过的静态解决方案，'/Home/Client/'
2. 将整个 JavaScript 移到您的视图中（不推荐）

3. 使用 JavaScript 变量存储 URL 并将其传递给外部文件：

   <script type="text/javascript">
      var myPath = '@Url.Action("Client","Home")';
   </script>
   

   在外部 JavaScript 文件中：

   $.ajax({
       url: myPath;
       ....
   

4. 另一个类似的选项是使用 html5 数据属性。通常，如果将ajax调用放在事件中，我选择的选项，例如click：

   <span data-url='@Url.Action("Client","Home")'>...</span>
   

   以及外部 JavaScript 文件：

   $("span").click(function() {
       $.ajax({
           url: $(this).attr("data-url"), //or $(this).data("url")
           ....