In this article I will explain with an example, how to use multiple Submit Buttons inside (.Net Core 8) Razor Pages.
Multiple Submit Buttons will be placed inside a single Form and each Button will call a different Handler Method in (.Net Core 8) Razor Pages.
Note: For beginners in ASP.Net Core (.Net Core 8) Razor Pages, please refer my article ASP.Net Core 8 Razor Pages: Hello World Tutorial with Sample Program example.
 
 

Index PageModel (Code-Behind)

The PageModel consists of the following Handler methods.

Handler method for handling GET operation

This Handler method is left empty as it is not required.
 
Save Handler method for handling POST operation – Button 1
This Handler method gets called on the click of the first button i.e. Save button. It sets a string message in ViewData object indicating that the Save button was clicked.
 

Cancel Handler method for handling POST operation – Button 2

This Handler method gets called on the click of the second button i.e. Cancel button. It sets a string message in ViewData object indicating that the Cancel button was clicked.
public class IndexModel : PageModel
{
    public void OnGet()
    {
 
    }
    public void OnPostSave()
    {
        ViewData["Message"] = "You clicked Save!";
    }
 
    public void OnPostCancel()
    {
        ViewData["Message"] = "You clicked Cancel!";
    }
}
 
 

Razor Page (HTML)

HTML Markup

The HTML of Razor Page consists of an HTML Form consisting two Submit Buttons.
The Submit Buttons has been set with the POST Handler method using the asp-page-handler attribute. 
When the Submit Buttons are clicked, the Form gets submitted.
At the end, there’s a JavaScript method that displays the ViewData object message using JavaScript Alert Message Box.
@page
@addTagHelper*,Microsoft.AspNetCore.Mvc.TagHelpers
@model Multiple_Submit_Razor_Core.Pages.IndexModel
 
@{
    Layout = null;
}
 
<!DOCTYPE html>
 
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <form method="post">
        <table>
            <tr>
                <td><input type="submit" id="btnSave" value="Save" asp-page-handler="Save" /></td>
                <td><input type="submit" id="btnCancel" value="Cancel" asp-page-handler="Cancel" /></td>
            </tr>
        </table>
    </form>
 
    @if (ViewData["Message"] != null)
    {
        <script type="text/javascript">
            window.onload = function () {
                alert('@ViewData["Message"]');
            };
        </script>
    }
</body>
</html>
 
 

Screenshot

ASP.Net Core: Using Multiple Submit Buttons in Razor Pages
 
 

Downloads