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