带有两个提交按钮并返回到同一页的剃须刀页面

Razor Page with two submit buttons and return to the same page(带有两个提交按钮并返回到同一页的剃须刀页面)

问题描述

我在使用Razor Pages的一个ASP.NET核心项目中遇到了奇怪的情况。
简单地说，我有一个带有两个提交按钮的表单。其中一个用于保存表单并返回主页，第二个用于保存表单，然后重新初始化ModelBindedProperty以再次插入另一个文档(保存并重复方案)。

第一个提交按钮没有定义页面处理程序，按照惯例，它应该调用PageModel文件上预定义的OnPostAsync方法，第二个按钮有一个asp-page-handler="SaveAndRepeat"，应该调用一个名为OnPostSaveAndRepeatAsync的自定义页面处理程序方法。

这是不带所有div和输入的cshtml代码。

<form method="POST">
    ... a lot of html and tags ...
    <button id="insert-doc-button" type="submit" class="btn btn-primary">Save</button>
    <button id="insert-repeat-doc-button" type="submit" asp-page-handler="SaveAndRepeat" class="btn btn-primary">Save and Repeat</button>            }
</form>

这是响应提交的PageModel文件中的精简代码

    [BindedProperty]
    DocumentVM CurrentDoc {get;set;}
    .....
    
    public async Task<IActionResult> OnPostAsync()
    {
        try
        {
            bool saved = await CommonSave();
            ......
            return RedirectToPage("/index");
        }
        ....
    }
    public async Task<IActionResult> OnPostSaveAndRepeatAsync()
    {
        try
        {
            bool saved = await CommonSave();
            ...
            // Duplicates the BindedProperty
            CurrentDoc = CurrentDoc.Duplicate();
            return Page();
        }
        ....
    }

现在的问题是。如您所见，在调用SaveAndRepeat之后，PageModel代码返回到与BindedProperty相同的页面，其中加载了上次保存时复制的值。(而且它的工作方式与预期一致) 但现在，如果我尝试按下保存按钮(因为我已经到达要插入的最后一个文档)，代码将再次调用OnPostSaveAndRepeatAsync处理程序，而不是默认的OnPostAsync。 当然，如果我只按下保存按钮，这不会发生，因为我只有一个文档要插入。在本例中，代码正确调用OnPostAsync。

老实说，我对这项技术不是很在行，现在才刚刚开始我的第一个项目，但这似乎还没有理解一些重要的东西。是的，我已经解决了为保存按钮设置asp页面处理程序的问题，但我真的很想知道发生这种行为的原因。

我还需要补充的是，此项目使用ASP.NET Core3.0，这是由于尚未在其托管服务器上启用3.1版本的ISP施加的限制。

推荐答案

如果您首先单击OnPost方法，它会起作用，因为您的路由上没有任何处理程序。

只要您使用asp-page-handler，处理程序的名称就会作为查询字符串参数添加到您的路由中，您可以在浏览器上查看它。

之后，您将调用默认的OnPost，它不需要任何处理程序参数，也不修改它们，这会使Razor页面认为您再次使用SaveAndRepeat处理程序调用POST，因此它被重定向到您的OnPostSaveAndRepeatAsync方法。

单击带有不同asp-page-handler的按钮会更改查询字符串上的处理程序参数，使其调用指定的方法。

这篇关于带有两个提交按钮并返回到同一页的剃须刀页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！