复选框单击 Razor Pages AspNetCore 2.2 中的表单提交

Question

我正在尝试（非Ajax）获取一个复选框以在 Razor Pages 中重新提交表单并重新加载页面/并在我的 OnPost 方法中捕获结果。

我有 index.cshtml

@page  "{id:int?}"
@model IndexModel

<div class="text-center">
    <form action="post" name="form1">
        <strong>Filter:</strong> Hide Single Runs <input onclick="document.form1.submit()" asp-for="@Model.HideSingle" />        
        <hr />

在我的 PageModel 中

public class IndexModel : PageModel
{
    public bool HideSingle { get; set; } = true;

    public async Task OnPost(int? id, bool hideSingle)
    {

说一个起始页 URL:

http://localhost:5000/TestRuns/1

表单在复选框单击时提交，但最终以 Url:

http://localhost:5000/TestRuns/post?HideSingle=false

这显然无法解决，因为我期待 http://localhost:5000/TestRuns/1 的路线。

Answer 1

<input onclick="document.form1.submit()" />

正在使用 JavaScript 提交表单。您是否希望页面返回 post，因为您没有使用 Ajax（来自您的问题）？

您希望来自您页面的呼叫最终成为 http://localhost:5000/TestRuns/post?id=1&HideSingle=false。您的 post 是否需要 id 才能工作（OnPost(int? id..) 不清楚？

我要获得两个值，您需要 hidden form values 或多个 <input asp-for="Email" class="form-control" />。 hideSingle 需要 1，id 需要 on。

Answer 2

对于 Asp.net 核心表单，默认方法是 Get，这意味着对于您当前的代码，它使用 Get 而不是 post 发送请求。您可以使用 post 指定方法，例如

<div class="text-center">
    <form method="post" name="form1">
        <strong>Filter:</strong> Hide Single Runs <input onclick="document.form1.submit()" asp-for="@Model.HideSingle" />
        <hr />
    </form>
</div>

对于另一种方式，您可以像

那样显式设置处理程序

<div class="text-center">
    <form asp-page-handler="post" name="form2">
        <strong>Filter:</strong> Hide Single Runs <input onclick="document.form2.submit()" asp-for="@Model.HideSingle" />
        <hr />
    </form>
</div>

复选框单击 Razor Pages AspNetCore 2.2 中的表单提交

Checkbox Click Form Submit in Razor Pages AspNetCore 2.2

asp.net-core

razor-pages