按下 ENTER 时，按钮单击未命中 OnPost() 方法

Question

我正在 ASP.NET Core Razor 页面上实现一个表单。问题是 OnPost() 方法在回车键上被击中（只有当我们第一次点击 GName 输入字段并且光标开始闪烁然后我们按下 Enter) 而不是点击按钮。

这里是 .cshtml 文件 <Form> 代码：

<div class="card-body">
    <form method="post">

        <div class="form-group">
            <label class="control-label lead text-center" asp-for="GName">
                Enter A Name To Create Greetings
            </label>
            <div class="input-group">
                <div class="input-group-prepend">
                    <div class="input-group-text">
                        <i class="fa fa-file-signature fa-1x"></i>
                    </div>
                </div>
                <input required type="text" style="text-transform:uppercase" asp-for="GName" class="form-control" />

            </div>
        </div>
        <button type="button" class="btn btn-primary btn-block">Create Greetings</button>
    </form>
</div>

这是 PageModel 中的 OnPost() 方法：

[BindProperty]
public string GName { get; set; }
 
public IActionResult OnPost()
{
    return GName != null ? RedirectToPage("./SelectGreetings", new { gname = GName }) : (IActionResult)Page();
}

Answer 1

将按钮类型更改为submit以执行表单提交：

<button type="submit" class="btn btn-primary btn-block">Create Greetings</button>

Introduction to Razor Pages in ASP.NET Core

按下 ENTER 时，按钮单击未命中 OnPost() 方法

Button click not hitting OnPost() method when ENTER is hit

c#

html

forms

asp.net-core

asp.net-core-razor-pages