如何使用 jQuery 的 ajax 方法调用局部视图答案

【问题标题】：How to call partial view using ajax method from jQuery如何使用 jQuery 的 ajax 方法调用局部视图
【发布时间】：2019-12-22 11:56:21
【问题描述】：

我与asp.net 合作，但我遇到了一些问题。

我创建了带有错误消息的局部视图，我想使用 jQuery 调用视图。

我已经在controller 中创建了function，它返回一个局部视图。但我被 ajax 卡住了，总是出错。

控制器：

[HttpGet]
public ActionResult LoadPartialView()
{
    return PartialView("_ErrorMessageWindow");
}

jQuery：

$.ajax({
        url: "@(Url.Action('LoadPartialView'))",
        type: "GET",
        cache: false,
        datatype: 'html',
        success: function (data) {
      }
});

错误：

jquery-3.3.1.min.js:2 GET https://localhost:5001/@(Url.Action('LoadPartialView'))?_=1565937416181 404（未找到）

【问题讨论】：

Url.Actio 中有拼写错误。更正它。
@RahulNikate 谢谢，已修复，但出现同样的错误
您在哪里编写Jquery 代码？是在.cshtml 还是单独的.js 文件中。
@RahulNikate 在 .js 文件中，在 cshtml 中创建的部分视图
请查看我对您的错误的回答。谢谢@qunzor。如果这对你有用，也请告诉我。

标签： c# jquery asp.net asp.net-mvc razor

【解决方案1】：

不工作的原因：

@Url.Action() 是 Razor 服务器端代码，不会在外部 .js 文件中解析。

解决方案：

在您的.cshtml 中创建此<div>：

<div id="partial-view-url" data-request-url="@Url.Action("LoadPartialView", "ControllerName")"></div>

然后使用data-request-url 在您的单独/外部.js 文件中获取部分视图网址，如下所示：

$("#partial-view-url").data('data-request-url');

所以你的$.Ajax会变成这样：

$.ajax({
        url: $("#partial-view-url").data('data-request-url'),
        type: "GET",
        cache: false,
        datatype: 'html',
        success: function (data) {

        }
});

另一种方式是声明全局变量： 在您的主 .cshtml 文件中创建全局变量，并在您的外部 .js 文件中使用它。

//Declare this variable in your main `.cshtml` file.
var partial-view-url = @Url.Action("LoadPartialView","ControllerName");

//and then use it in your separate/external `.js` file.
$.ajax({
        url: partial-view-url,
        type: "GET",
        cache: false,
        datatype: 'html',
        success: function (data) {

        }
});

【讨论】：