单击表单按钮时，Asp-Page-Handler 未触发 Razor 模型中的方法答案

【问题标题】：Asp-Page-Handler not firing Method in Razor Model when Form Button is Clicked单击表单按钮时，Asp-Page-Handler 未触发 Razor 模型中的方法
【发布时间】：2019-10-27 12:28:38
【问题描述】：

首先请知道我已经用谷歌搜索并尝试了我找到的所有内容。我一直在解决一个又一个的解决方案，并在发布之前阅读了数十个 Stack Overflow 问题。我不知道为什么这不起作用。话虽如此，我对方法处理程序的东西不是很熟悉，所以我可能会犯一个愚蠢的错误。

实施细节
- .NET Core 2.2
- Microsoft.AspNetCore.Razor.Design 2.2.0
- AngularJS.Core 1.7.8

我正在创建一个内部门户来聚合 Jenkins 构建和测试数据。我想允许通过页面上的按钮启动运行 Jenkins 测试的作业的构建。当我单击按钮时，我没有收到任何错误。我在控制台中什么也得不到，也没有遇到任何断点，如果它实际上触发了 OnPost 方法。

我尝试过使用 OnPost 和 OnPostAsync 方法。我尝试通过 asp-page-handler 使用自定义名称以及默认名称。我尝试将 asp-page-handler 标记放在表单和按钮上。我尝试过使用按钮和输入。似乎没有什么能改变这种行为。

我的 Razor 页面的标题

@page "{handler?}"
@using JenkinsRazorApi.Pages
@using System.Linq;
@using System.Data;
@using System.Web;
@model FslModel
@{
    ViewData["Title"] = "fsl";
}

我的 cshtml 标记

<div>
   <form method="POST">
      <input type="submit" class="btnKickOffBuild" name="kickOffBuild" id="btnKickOffBuild" asp-page-handler="BuildClick" value="Build"/>
   </form>
</div>

我的模型中的方法（PostToApi 方法是异步的，这就是我使用 OnPost 的异步版本的原因）

public void OnPostBuildClickAsync()
{
   apiClientCalls.PostToApi("FslSmokeTest", "BuildKickOff");
}

当页面加载没有问题时，我的 OnGetAsync 方法会触发。该方法中发生的一切都有效。我能够以正常的 Razor 方式引用模型，因此模型可以访问并绑定到页面。当我单击 btnKickOffBuild 按钮时，我无法在模型中触发 OnPost 方法。

如果有人能指出正确的方向，我将不胜感激。

******************编辑************************
我尝试使 OnPostBuildClickAsync 方法实际上是异步的，并且我尝试了上面的方法，并将 Async 从方法名称中删除，但无济于事。

作为测试，我还尝试在全局范围内关闭所有与 Razor 框架相关的 Anti-Forgery 功能，以排除这种情况。那也没用。

我尝试以完全不同的方式执行此操作，方法是将方法添加到我的 Angular 范围中，该方法包含在一个 javascript 函数中，该函数应该仅在单击按钮时触发，但由于它是服务器端 @ 标记，它在页面加载时运行，无论函数中的条件。

******************编辑************************
这归结为 Angular 的事情。

根据以下链接中的“提交表单并阻止默认操作”部分： https://docs.angularjs.org/api/ng/directive/form

Angular 需要一个动作标签来将表单提交到服务器。没有它，表单将无法提交。我将我的 cshtml 更改为：

<div>
   <h5 style="margin-left: 50px; float:left;">Test Pass/Fail</h5>
   <form method="post" action="">
      <button type="submit" class="btnKickOffBuild" asp-page-handler="BuildClick">Build</button>
   </form>
</div>

特别值得注意的是action=""。这会强制 Angular 不阻止向服务器提交表单。

以下问题也包含有关 Angular Actions 的一些详细信息：
ng-action does not add action attribute in the form

【问题讨论】：

您的异步方法实际上可能需要是一个异步方法。您是否尝试过“public async Task OnPostBuildClickAsync()”或没有异步“public void OnPostBuildClick()”
也可以区分大小写，试试method="post" vs method="POST"
你好@史蒂夫。我很欣赏你的评论。我创建了 Async 方法并尝试了它，然后我把它放回去并从方法名称中删除了 Async。这两种方法都不起作用。
你解决过这个问题吗？有完全相同的问题。
@zszep 我让它在 ************EDIT********** 行之后处理文本。这在我当前的应用中运行良好。

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

【解决方案1】：

编辑：我找到了它的根本原因。您需要创建 Razor ViewImport 文件并导入该文件中的所有 razor 依赖项。这样您就可以在应用程序中使用 taghelpers

【讨论】：