In this article we will see how we can use multiple submit buttons inside a single form tag in ASP.NET MVC view page, where each submit button will target different actions based on its value. It is important to note that we will use a single POST action to handle multiple submit requests from these buttons.

Now suppose we have a requirement to show the list of employees in tabular format, where each row will have few submit buttons to target different actions. Let's say we need two actions to be taken for every employee in the list, so we can add two buttons say View and Edit in each row having same name but different value.

Let's see how to achieve this requirement in the following steps.
 

Step-1 Create a class which will be used to create collection of employees.
 

EmployeeViewModel.cs

namespace WebApplication1.Models
{
	public class EmployeeViewModel
	{
		public string EmployeeId { get; set; }
	
		public string Name { get; set; }
	
		public string Address { get; set; }
	}
}

Step-2 Create a HttpGet method which will take the list of employees and send it to the view for showing in tabular format. In the following example, we are using hard-coded values for employees which will be most probably get replaced with the database call in your real application.
 

public ActionResult Index()
{
    // May get replaced with database call to select the list of employees
	
    List<EmployeeViewModel> empList = new List<EmployeeViewModel>{
        new EmployeeViewModel { EmployeeId = "1", Name = "File1", Address = "Address 1" },
        new EmployeeViewModel { EmployeeId = "2", Name = "File2", Address = "Address 2" },
        new EmployeeViewModel { EmployeeId = "3", Name = "File3", Address = "Address 3" }
    };

    return View(empList);
}

Step-3 Now as you may have realized, we would need a strongly bind view expecting the collection of EmployeeViewModel type, because it has to be matched with the type returned from the Index method in Step-1.

In view page there will be a loop to iterate through each employee and showing related details inside every new table row. While generating every new row, we are also adding a new form tag which contains the action buttons. If you will see a form tag in the following line there is a route parameter empId getting initialized with unique value of EmployeeId, so every time we click on any of the action button, we are also passing this empId value to the HttpPost method in the controller class.
 

@using (Html.BeginForm("Index", "Home", new RouteValueDictionary {{ "empId", item.EmployeeId } }, FormMethod.Post))

Index.cshtml (View Page)

@model IEnumerable<WebApplication1.Models.EmployeeViewModel>

@{
    ViewBag.Title = "Index";
}

<table class="table">
    <tr>
        <th>
            Name
        </th>
        <th>
            Address
        </th>
        <th>
            Actions
        </th>
    </tr>

    @if (Model != null)
    {
        foreach (var item in Model)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.Name)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Address)
                </td>
                <td>
                    @using (Html.BeginForm("Index", "Home", new RouteValueDictionary {{ "empId", item.EmployeeId } }, FormMethod.Post))
                    {
                        @Html.AntiForgeryToken()

                        <div class="col-lg-3">
                            <button type="submit" id="btnView" name="Command" value="View">View</button>
                        </div>

                        <div class="col-lg-3">
                            <button type="submit" id="btnEdit" name="Command" value="Edit">Edit</button>
                        </div>
                    }
                </td>
            </tr>
        }
    }
</table>

Step-3 In the controller class, let's create a HttpPost method Index to handle the post requests from the Index.cshtml view. Here the first parameter empId will receive the value of EmployeeId from the row containing the clicked button and second parameter Command will get the value of the button clicked inside a row. So if we click on View button, Command parameter will get its value as View and if we choose to click the Edit button we will get Command value as Edit, hence allowing us to easily differentiate between the actions available in the view.

[HttpPost]
public ActionResult Index(string empId, string Command)
{
	switch (Command)
	{
		case "View":
                // View button is clicked
	            // Implement View operation on empId received
	            break;

		case "Edit":
                // Edit button is clicked
	            // Implement Edit operation on empId received
		    break;
	}
}

Likewise we can use multiple buttons with different values to uniquely identity them in POST method. Hope it helps you. :)