ASP.NET MVC Form Submitting Twice Error

In this post I want to present the causes and resolutions of the cases when a form in a web application automatically submits more than once (usually twice). This usually happens with the forms created with @using (Ajax.BeginForm()) approach. A developer new to ASP.NET MVC can spend hours trying to find out the lines in their code that are duplicated resulting in duplicate form submissions. I have been there as well.

So, what causes this error? It happens because jquery.unobtrusive-ajax.js file is referenced more than once in the webpage. This could be as simple as the script tags being accidentally copied-pasted more than once in the page header or as complicated as a result of some idiosyncrasies of ASP.NET MVC Bundling features. Here are a few things that you can do to help locate and fix duplication.

1. Turn of Bundling optimizations - The first thing to debug it is to set BundleTable.EnableOptimizations = false in the RegisterBundles method of your BundleConfig.cs file in the App_Start folder. This will ensure that the individual script tags for all of the scripts are visible.
2. Remove the wildcards in ScriptBundle().Include() - Visual Studio usually creates some of the jQuery references using * wildcards. This can be found in the RegisterBundles method in the BundleConfig.cs file. Specifically, you're looking for the following line -
   bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include("~/Scripts/jquery.unobtrusive*"));
   Here jquery.unobtrusive* allows all of the unobtrusive files to be included in the project. But sometimes, if your script folder has both the regular (jquery.unobtrusive-ajax.js) and the minified (jquery.unobtrusive-ajax.min.js) versions of the file, essentially including the same file twice. Once you have isolated this as the cause, you can consider removing non-minified from the production server.
3. Check if any other views have the same Script.Render lines - Sometimes, visual studio will include the script sections in views by default for ASP.NET MVC projects, which can result in the developer accidentally copying the @Scripts.Render("~/bundles/jqueryval") line in more than one views. So, do a global search for the @Scripts.Render("~/bundles/jqueryval") line and remove it at all places except for the _Layout.cshtml / master page.
4. Check to ensure that jquery.unobtrusive-ajax.js file is included only once in the ScriptBundle - For this, you can do a seach for jquery-unobtrusive in the BundleConfig.cs file. If the same file or its minified versions appear more than once, then remove them.
5. Turn off bundling and include the script tags in your page - If nothing else works, you can consider turning off the bundling. You can do this by removing the @Scripts.Render("~/bundles/jqueryval") line from your layout and all other views. Then add the script tags manually to only your layout or master page. This will help rule out the bundling issues. This will most likely fix this problem for good, as much as I like the bundling approach (Note: At the risk of being super cliche`, I should mention that it's not the bundling at fault here, it's how it's used in the application).