根据点击的提交button,将表单发布到不同的MVC发布操作

我正在使用ASP.Net MVC 4 。 我在一个视图上有多个button..目前我正在调用相同的操作方法; 我用name属性区分点击button。

 @using (Html.BeginForm("Submit", "SearchDisplay", new { id = Model == null ? 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> } 

//行动

  [HttpPost] public ActionResult Submit(SearchCostPage searchModel, string Command) { SessionHelper.ProjectCase = searchModel.ProjectCaseNumber; if (string.Equals(Command, Constants.SearchPage.ExportToExcel)) { } } 

质询

  1. 有不同的button点击(没有自定义路由)指向不同的POST动作方法吗?
  2. 如果没有自定义路由,没有办法,我们如何使用自定义路由呢?

参考文献:

  1. Jimmy Bogard – 清理ASP.NET MVC中的POST

您可以根据浏览器支持,以不同的方式select表单必须发布的url(以及调用的操作):

  • 对于支持HTML5的新型浏览器,可以使用提交button的formaction属性
  • 对于不支持这一点的旧浏览器,您需要使用一些JavaScript来更改表单的操作属性 ,单击button时,提交前

这样你就不需要在服务器端做任何特殊的事情。

当然,您可以使用Razor中的Url扩展方法来指定表单操作。

对于支持HMTL5的浏览器:简单地定义你的提交button是这样的:

 <input type='submit' value='...' formaction='@Url.Action(...)' /> 

对于旧版浏览器,我build议使用这样一个不显眼的脚本(将其包含在“主版面”中):

 $(document).on('click', '[type="submit"][data-form-action]', function (event) { var $this = $(this); var formAction = $this.attr('data-form-action'); $this.closest('form').attr('action', formAction); }); 

注:该脚本将处理页面中具有type=submitdata-form-action属性的任何元素的点击。 发生这种情况时,它将获取data-form-action属性的值,并将包含表单的操作设置为此属性的值。 因为它是一个委托事件,所以即使是使用AJAX加载的HTML,也不会执行额外的步骤。

然后你只需要添加一个data-form-action属性和所需的动作URL到你的button,就像这样:

 <input type='submit' data-form-action='@Url.Action(...)' value='...'/> 

请注意,单击该button可更改表单的操作,并在此之后,浏览器将表单发送到所需的操作。

正如你所看到的,这不需要自定义路由,你可以使用标准的Url扩展方法,而且在现代浏览器中没有什么特别的事情要做。

最佳答案1:

在中提到的ActionNameSelectorAttribute

  1. 你如何处理ASP.NET MVC框架中的多个提交button?

  2. ASP.Net MVC 4表单提交2个button/操作

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

答案2

参考: dotnet技巧 – 在同一个表单上处理多个提交button – MVC Razor

第二种方法

添加一个新的处理取消button单击表单。 现在,点击取消button,我们将发布第二个表单,并将redirect到主页。

第三种方法:客户端脚本

 <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> 

这对我来说听起来像你有一个命令与2输出,我会select在客户端和服务器的这一变化。

在客户端,使用JS来build立你想发布的URL(为了简单起见,使用JQuery)即

 <script type="text/javascript"> $(function() { // this code detects a button click and sets an `option` attribute // in the form to be the `name` attribute of whichever button was clicked $('form input[type=submit]').click(function() { var $form = $('form'); form.removeAttr('option'); form.attr('option', $(this).attr('name')); }); // this code updates the URL before the form is submitted $("form").submit(function(e) { var option = $(this).attr("option"); if (option) { e.preventDefault(); var currentUrl = $(this).attr("action"); $(this).attr('action', currentUrl + "/" + option).submit(); } }); }); </script> ... <input type="submit" ... /> <input type="submit" name="excel" ... /> 

现在在服务器端,我们可以添加一个新的路由来处理Excel请求

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

您可以设置2个不同的操作

 public ActionResult SubmitExcel(SearchCostPage model) { ... } public ActionResult Submit(SearchCostPage model) { ... } 

或者你可以使用ActionName属性作为别名

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

你可以使用ajax调用来调用不同的方法而不用回发

 $.ajax({ type: "POST", url: "@(Url.Action("Action", "Controller"))", data: {id: 'id', id1: 'id1' }, contentType: "application/json; charset=utf-8", cache: false, async: true, success: function (result) { //do something } });