[Example]-Handling multiple submit buttons on the same form .Net Core Razor

Using the example provided above, I handle multiple submit buttons in ASP.NET Core Razor on the same page. For instance, let's consider two tables: one for Employees with properties like Id, Name, Email, and Count, and another for Products with properties like Id, ProductName, Price, and Description.

To manage these multiple submit buttons, I utilize conditional logic in the Razor view. Depending on the button clicked, I execute the corresponding action in the controller. For example, clicking the submit button for adding an employee triggers the action method in the controller to handle employee data submission, while clicking the submit button for adding a product triggers a different action method to handle product data submission.

Employee and Productclasses in a Blazor application:

// Employee.cs
public class Employee
{
    public int Id { get; set; }
    public string Name { get; set; }
    public string Email { get; set; }
    public string Country { get; set; }
}

// Product.cs
public class Product
{
    public int Id { get; set; }
    public string ProductName { get; set; }
    public decimal Price { get; set; }
    public string Description { get; set; }
}

Now let's handle multiple submit buttons in the same ASP.NET Core Razor page, let's integrate both the employee and product forms into a single page.

@page
@model AddEmployeeProductModel
@{
    ViewData["Title"] = "Add Employee and Product";
}

<h2>Add Employee</h2>
<form method="post">
    <label asp-for="Employee.Id">Employee ID:</label>
    <input asp-for="Employee.Id" />

    <label asp-for="Employee.Name">Employee Name:</label>
    <input asp-for="Employee.Name" />

    <label asp-for="Employee.Email">Employee Email:</label>
    <input asp-for="Employee.Email" />

    <label asp-for="Employee.Country">Country:</label>
    <input asp-for="Employee.Country" />

    <button type="submit" name="addEmployee">Add Employee</button>
</form>

<h2>Add Product</h2>
<form method="post">
    <label asp-for="Product.Id">Product ID:</label>
    <input asp-for="Product.Id" />

    <label asp-for="Product.ProductName">Product Name:</label>
    <input asp-for="Product.ProductName" />

    <label asp-for="Product.Price">Price:</label>
    <input asp-for="Product.Price" />

    <label asp-for="Product.Description">Description:</label>
    <input asp-for="Product.Description" />

    <button type="submit" name="addProduct">Add Product</button>
</form>

Now, let's handle the form submissions in the Razor page model.

using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using MyNamespace;

public class AddEmployeeProductModel : PageModel
{
    private readonly IEmployeeService _employeeService;
    private readonly IProductService _productService;

    public AddEmployeeProductModel(IEmployeeService employeeService, IProductService productService)
    {
        _employeeService = employeeService;
        _productService = productService;
    }

    [BindProperty]
    public EmployeeViewModel Employee { get; set; }

    [BindProperty]
    public ProductViewModel Product { get; set; }

    public IActionResult OnPost(string addEmployee, string addProduct)
    {
        if (!string.IsNullOrEmpty(addEmployee))
        {
            _employeeService.AddEmployee(Employee);
            return RedirectToPage("EmployeeList");
        }
        else if (!string.IsNullOrEmpty(addProduct))
        {
            _productService.AddProduct(Product);
            return RedirectToPage("ProductList");
        }

        return Page();
    }
}