31/5/2019 asp.

asp.net mvc - Posting form to different MVC post action depending on the clicked submit button - Stack Overflow

Posting form to different MVC post action Ask Question

depending on the clicked submit button

I am using ASP.Net MVC 4 . I have

multiple buttons on a view.. At
54 present I am calling the same action
method; and I am distinguishing the
clicked button using a name attribute.

@using (Html.BeginForm("Submit", "SearchDisplay", new { id = Model == null ?

18 Guid.NewGuid().ToString() : Model.SavedSearch }, FormMethod.Post))
{
<div class="leftSideDiv">
<input type="submit" id="btnExport" class="exporttoexcelButton"
name="Command" value="Export to Excel" />
</div>

<div class="pageWrapperForSearchSubmit">
<input type="submit" class="submitButton"
value="Submit" id="btnSubmitChange" />
</div>
}

//ACTION

[HttpPost]
public ActionResult Submit(SearchCostPage searchModel, string Command)
{
SessionHelper.ProjectCase = searchModel.ProjectCaseNumber;

if (string.Equals(Command, Constants.SearchPage.ExportToExcel))
{

}
}

QUESTIONS

1. Is there a way to direct to

different POST action methods
on different button clicks (without
custom routing)?
2. If there is no way without custom
routing, how can we do it with
custom routing?

References:

1. Jimmy Bogard - Cleaning up

By using our site, you acknowledge that you have read and understand our Cookie Policy, Privacy Policy, and our
POSTs in ASP.NET MVC
Terms of Service.

https://stackoverflow.com/questions/21116999/posting-form-to-different-mvc-post-action-depending-on-the-clicked-submit-button 1/6
31/5/2019 asp.net mvc - Posting form to different MVC post action depending on the clicked submit button - Stack Overflow

asp.net-mvc asp.net-mvc-4

edited Jan 16 '14 at 8:31

asked Jan 14 '14 at 15:13

Lijo
11.2k 55 200 341

1 JS will allow you to pre-process your

submit request, it doesn't mean you
can't still have a full postback. –
James Jan 14 '14 at 15:22

I have posted an answer. – James Jan

14 '14 at 15:58

1 I've edited your question's title to

make it more accurate, and added a
simple, working answer (working in
production in some of my projects). –
JotaBe Jan 14 '14 at 16:33

Why not go the multiple submit button

route a la
stackoverflow.com/questions/442704/
… – Paul Zahra May 10 '18 at 10:53

4 Answers

¿No encuentras la ✕
respuesta? Pregunta en
Stack Overflow en español.

You can choose the url where the

form must be posted (and thus, the
79 invoked action) in different ways,
depending on the browser support:

for newer browsers that support

HTML5, you can use formaction
attribute of a submit button
for older browsers that don't
support this, you need to use
some JavaScript that changes
the form's action attribute, when
the button is clicked, and before
submitting

In this way you don't need to do

anything special on the server side.

Ofyou
By using our site, course, you can
acknowledge use
that youUrl
have read and understand our Cookie Policy, Privacy Policy, and our
Terms of Serviceextensions
. methods in your Razor to
specify the form action.
https://stackoverflow.com/questions/21116999/posting-form-to-different-mvc-post-action-depending-on-the-clicked-submit-button 2/6
31/5/2019 asp.net mvc - Posting form to different MVC post action depending on the clicked submit button - Stack Overflow

For browsers supporting HMTL5:

simply define your submit buttons like
this:

<input type='submit' value='...' form

For older browsers I recommend

using an unobtrusive script like this
(include it in your "master layout"):

$(document).on('click', '[type="submi
var $this = $(this);
var formAction = $this.attr('data-f
$this.closest('form').attr('action'
});

NOTE: This script will handle the click

for any element in the page that has
type=submit and data-form-action
attributes. When this happens, it
takes the value of data-form-action
attribute and set the containing form's
action to the value of this attribute. As
it's a delegated event, it will work
even for HTML loaded using AJAX,
without taking extra steps.

Then you simply have to add a data-

form-action attribute with the desired
action URL to your button, like this:

<input type='submit' data-form-action

Note that clicking the button changes

the form's action, and, right after that,
the browser posts the form to the
desired action.

As you can see, this requires no

custom routing, you can use the
standard Url extension methods,
and you have nothing special to do in
modern browsers.

edited Apr 29 '14 at 14:52

quadfinity
797 1 7 9

answered Jan 14 '14 at 16:08

JotaBe
30.3k 6 65 95

1 I'm afraid I cannot. I did this myself.

Please, try it, and if you have any
doubt write a comment and I'll help
you
By using our site, you by improvingthat
acknowledge my you
answer.
have read and understand our Cookie Policy, Privacy Policy, and our
Although I think kit's quite clear, and
Terms of Service.
you'll get it working soon. – JotaBe
Jan 16 '14 at 9:42
https://stackoverflow.com/questions/21116999/posting-form-to-different-mvc-post-action-depending-on-the-clicked-submit-button 3/6
31/5/2019 asp.net mvc - Posting form to different MVC post action depending on the clicked submit button - Stack Overflow
Jan 16 14 at 9:42

Simply the best. – Zaker May 4 '15 at

8:18

Could you use both methods

simultaneously to support multiple
browsers? Or must you choose one or
the other? – navig8tr May 25 '16 at
0:51

1 The JavaScript solution supports both

old and new browsers provided that
JavaScript isn't disabled. Using both
techniques at the same time, which is
possible, would also cover the case of
HTML5 compatible browsers with
JavaScript disabled. – JotaBe May 25
'16 at 8:59

BEST ANSWER 1:

ActionNameSelectorAttribute
20 mentioned in

1. How do you handle multiple

submit buttons in ASP.NET MVC
Framework?
2. ASP.Net MVC 4 Form with 2
submit buttons/actions

http://weblogs.asp.net/scottgu/archiv
e/2007/12/09/asp-net-mvc-
framework-part-4-handling-form-edit-
and-post-scenarios.aspx

ANSWER 2

Reference: dotnet-tricks - Handling

multiple submit buttons on the same
form - MVC Razor

Second Approach

Adding a new Form for handling

Cancel button click. Now, on Cancel
button click we will post the second
form and will redirect to the home
page.

Third Approach: Client Script

By using our site, you acknowledge that you have read and understand our Cookie Policy, Privacy Policy, and our
<button name="ClientCancel" type="but
Terms of Service.
onclick=" document.location.href

https://stackoverflow.com/questions/21116999/posting-form-to-different-mvc-post-action-depending-on-the-clicked-submit-button 4/6
31/5/2019 asp.net mvc - Posting form to different MVC post action depending on the clicked submit button - Stack Overflow
Side)
</button>
<a id="cancelUrl" href="@Html.Attribu
style="display:none;"></a>

edited May 23 '17 at 11:47

Community ♦
1 1

answered Jan 16 '14 at 5:19

Lijo
11.2k 55 200 341

This sounds to me like what you have

is one command with 2 outputs, I
5 would opt for making the change in
both client and server for this.

At the client, use JS to build up the

URL you want to post to (use JQuery
for simplicity) i.e.

<script type="text/javascript">
$(function() {
// this code detects a button
// in the form to be the `nam
$('form input[type=submit]').
var $form = $('form');
form.removeAttr('option')
form.attr('option', $(thi
});
// this code updates the URL
$("form").submit(function(e)
var option = $(this).attr
if (option) {
e.preventDefault();
var currentUrl = $(th
$(this).attr('action'
}
});
});
</script>
...
<input type="submit" ... />
<input type="submit" name="excel" ...

Now at the server side we can add a

new route to handle the excel request

routes.MapRoute(
name: "ExcelExport",
url: "SearchDisplay/Submit/excel"
defaults: new
{
controller = "SearchDisplay",
action = "SubmitExcel",
});

You
By using our site, youcan setup 2 distinct
acknowledge that youactions
have read and understand our Cookie Policy, Privacy Policy, and our
Terms of Service.

https://stackoverflow.com/questions/21116999/posting-form-to-different-mvc-post-action-depending-on-the-clicked-submit-button 5/6
31/5/2019 asp.net mvc - Posting form to different MVC post action depending on the clicked submit button - Stack Overflow

public ActionResult SubmitExcel(Searc

{
...
}

public ActionResult Submit(SearchCost

{
...
}

Or you can use the ActionName

attribute as an alias

public ActionResult Submit(SearchCost

{
...
}

[ActionName("SubmitExcel")]
public ActionResult Submit(SearchCost
{
...
}

answered Jan 14 '14 at 15:58

James
61.9k 16 125 199

the alias one solved my issue, thanks

a lot. – Enzero May 12 '16 at 8:26

you can use ajax calls to call different

methods without a postback
3
$.ajax({
type: "POST",
url: "@(Url.Action("Action", "Co
data: {id: 'id', id1: 'id1' },
contentType: "application/json;
cache: false,
async: true,
success: function (result) {
//do something
}
});

answered Jan 14 '14 at 15:18

Matt Bodily
6,011 4 22 42

I need a full postback – Lijo Jan 14

'14 at 15:20

By using our site, you acknowledge that you have read and understand our Cookie Policy, Privacy Policy, and our
Terms of Service.

https://stackoverflow.com/questions/21116999/posting-form-to-different-mvc-post-action-depending-on-the-clicked-submit-button 6/6