ASP.NET MVC 6 Tutorial :: Handle Multiple Submit Buttons On The Same Form in MVC 6

In this post I will explain you about Handling multiple submit buttons on the same form in MVC.To fix this problem, I’m progressing to justify the varied techniques for handling multiple buttons on the same form in MVC.

Sometimes you got situation like more than one submit buttons on a similar form in ASP.NET MVC 6. At that point, How we will handle the click event of every and each buttons on your form? Suppose you’ve got a user Login form like as below:

On the above picture, we have the SignUp, SignIn and the Cancel buttons. Suppose on Signup button click you have to open Signup window & on SignIn button click you have to open Login window and on Cancel button click you are returning to home page. For handling all of the above buttons, we have the following methods:

Export Gridview to Excel: Gridview to Excel
Insert,Update,Delete in ModalPopup CRUD operation in ModalPopup
Read and Write in Text File in ASP.NET Read and Write File in ASP.NET

Now, Make the view Form with Multiple Button in Home Folder with the following code.

MultipleCommand.cshtml
@model Mvc4_Multiple_Submit_Button.Models.RegistrationModel
@{
ViewBag.Title = "Handling Multiple Command Buttons";
}
<script src="../../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.validate.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>
<h2>User's Signup Form</h2>
@using (Html.BeginForm("MultipleCommand", "Home", FormMethod.Post, new { id = "submitForm" }))
{
<fieldset>
<legend>Registration Form</legend>
<ol>
<li>
@Html.LabelFor(m => m.Name)
@Html.TextBoxFor(m => m.Name, new { maxlength = 50 })
@Html.ValidationMessageFor(m => m.Name)
</li>
<li>
@Html.LabelFor(m => m.Address)
@Html.TextAreaFor(m => m.Address, new { maxlength = 200 })
@Html.ValidationMessageFor(m => m.Address)
</li>
<li>
@Html.LabelFor(m => m.MobileNo)
@Html.TextBoxFor(m => m.MobileNo, new { maxlength = 10 })
@Html.ValidationMessageFor(m => m.MobileNo)
</li>
</ol>
<button type="submit" id="btnSave" name="Command" value="Save">
Save</button>
<button type="submit" id="btnSubmit" name="Command" value="Submit">
Submit</button>
<button type="submit" id="btnCancel" name="Command" value="Cancel" onclick="$('#submitForm').submit()">
Cancel (Server Side)</button>
<button type="submit" id="btnCancelSecForm" name="Command" value="Cancel" onclick="$('#cancelForm').submit()">
Cancel (Server Side by Second Form)</button>
<button name="ClientCancel" type="button" onclick=" document.location.href = $('#cancelUrl').attr('href');">
Cancel (Client Side)</button>
<a id="cancelUrl" href="@Html.AttributeEncode(Url.Action("Index", "Home"))" style="display:none;">
</a>
</fieldset>
}
@using (Html.BeginForm("MultipleButtonCancel", "Home", FormMethod.Post, new { id = "cancelForm" })) { }

Next step, in Homecontroller include the MultipleCommand Method to handle the multiple button with the following code.

HomeController.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Mvc4_Multiple_Submit_Button.Models;
namespace Mvc4_Multiple_Submit_Button.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
public ActionResult MultipleCommand()
{
return View();
}
[HttpPost]
public ActionResult MultipleCommand(RegistrationModel mReg, string Command)
{
if (Command == "Save")
{
//TO DO : for Save button Click
}
else if (Command == "Submit")
{
//TO DO : for Submit button Click
}
else
{
//TO DO : for Cancel button Click
return RedirectToAction("Index");
}
return View();
}
[HttpPost]
public ActionResult MultipleButtonCancel()
{
//TO DO : for Cancel button Click
return RedirectToAction("Index");
}
}
}

HostForLIFE.eu