javascript - ASP .NET Core 3.0 Razor Pages 使用 @Url.Page 为 AJAX 生成动态 href url

Question

我有一个 anchor 标记，在 onclick 上有一个 javascript 函数，调用我的方法通过 Ajax 更新页面。

该页面显示订单的详细信息，并且 ajax 更新显示详细订单的位置。

问题是:如何动态生成和传递 URL？

这是我的 anchor 标记:

<a class="nav-link text-dark text-center p-0 collapsed"
   data-toggle="collapse"
   data-target="#Details"
   aria-expanded="true"
   aria-controls="Details"
   href="@Url.Page("Area/Details/" + @Model.wItem.GUID,  "ShowDetails")"                                           
   id="ShowDetails"
   onclick="ShowDetailsAjax(this, '@Model.wItem.GUID')">
   @item.Position
</a>

这是我的 JavaScript 函数:

function ShowPositionAjax(x, _GUID) {

    var _url = '';
    var _position = x.outerText;
    var parameters = "{'position':'" + _position + "','GUID':'" + _GUID + "'}";

    $.ajax({
        url: _url,
        type: 'GET',
        cache: false,
        async: true,
        headers: {
            RequestVerificationToken:
                $('input:hidden[name="__RequestVerificationToken"]').val()
        },
        data: parameters
    })
        .done(function (result) {
            $('#MainframeContents').html(result);
        });
}

anchor 标记所在的 Razor 页面名为 Area/Details/123456-45646-123132(其中 123456-45646-123132 是 GUID)。问题是，我不想对 url 进行硬编码，因为 GUID 可以更改。

我已经尝试过

href="@Url.Page("Area/Details/" + @Model.wItem.GUID,  "ShowDetails")"

但在 javascript 中 href 为空。

Answer 1

我在这里发布解决方案；这比评论更好。

最初我使用这个href:

href="@Url.Page("Area/Details/" + @Model.wItem.GUID,  "ShowDetails")">  

使用 Url.Page 因为我使用的是 Razor 而不是 MVC。阅读 MS 文档(https://learn.microsoft.com/en-us/aspnet/core/mvc/controllers/areas?view=aspnetcore-3.0)我注意到我正在使用区域，所以正确的href应该是:

href='@Url.Page("Details", "ShowDetails",  new { area = "Area", position = item.Position, GUID = @Model.wItem.GUID })'

详细信息:是我的主页的名称

ShowDetails:是我的 GET 处理程序的名称

区域:是我的区域的名称

位置和GUID:是我的 GET 处理程序的参数

结果 href URL 将类似于:

/en/Area/Details/45646546-1213-156416-45646-5464666?position=1&handler=ShowDetails

调用我的处理程序:

public async Task<IActionResult> OnGetShowDetailsAsync(string GUID, string position)
{
    ...
}

希望这可以节省其他人的时间。

感谢@Rory McCrossan 的建议。