blocks|key|4101783|text|单击提交时禁用该按钮。这可以使用JQuery/Java+Script来完成。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4101784|关于如何做到这一点，请查看this+example。|offset|length|4101785|entityMap|0|LINK|mutability|MUTABLE|url|http://jquery-howto.blogspot.com/2009/05/disable-submit-button-on-form-submit.html^0|0|D|C|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@$D|P|E|Q|1|R]]|A|$]]|$1|F|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|G|$H|$5|I|J|K|A|$L|M]]]]

Disable the button on Submit clicked. This can be done using JQuery/Java Script.

Look at <a href="http://jquery-howto.blogspot.com/2009/05/disable-submit-button-on-form-submit.html" rel="noreferrer">this example</a> on how to do this.

blocks|key|263066|text|我不认为这是评论中提到的答案的重复，因为这个链接是针对spring+MVC的，而这个问题是针对.NET+MVC的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|263067|实际上，我之前花了几个小时在这上面，并想出了以下几点。这个javascript与不显眼的jquery验证很好地结合在一起，您可以将它应用于任何具有<input+type="submit"的表单。注意，它使用了jQuery1.7的on函数：|offset|length|style|CODE|263068|$(document).on('invalid-form.validate',+'form',+function+()+{
++++var+button+=+$(this).find(':submit');
++++setTimeout(function+()+{
++++++++button.removeAttr('disabled');
++++},+1);
});
$(document).on('submit',+'form',+function+()+{
++++var+button+=+$(this).find(':submit');
++++setTimeout(function+()+{
++++++++button.attr('disabled',+'disabled');
++++},+0);
});|code-block|syntax|javascript|263069|setTimeouts是必需的。否则，您最终可能会得到一个按钮，即使在客户端验证失败时，该按钮在单击后也会被禁用。我们把它放在一个全局javascript文件中，这样它就会自动应用到我们所有的表单中。|263070|更新2020年11月16日，由++提供|BOLD|263071|将选择器input[type="submit"]替换为:submit，因此它也可以与<button+type="submit"+/>一起工作|263072|entityMap^0|0|21|K|36|2|0|0|0|0|F|0|4|K|R|7|16|O|0^^$0|@$1|2|3|4|5|6|7|V|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|W|8|@$D|X|E|Y|F|G]|$D|Z|E|10|F|G]]|9|@]|A|$]]|$1|H|3|I|5|J|7|11|8|@]|9|@]|A|$K|L]]|$1|M|3|N|5|6|7|12|8|@]|9|@]|A|$]]|$1|O|3|P|5|6|7|13|8|@$D|14|E|15|F|Q]]|9|@]|A|$]]|$1|R|3|S|5|6|7|16|8|@$D|17|E|18|F|G]|$D|19|E|1A|F|G]|$D|1B|E|1C|F|G]]|9|@]|A|$]]|$1|T|3|-4|5|6|7|1D|8|@]|9|@]|A|$]]]|U|$]]

I don't think this is quite a duplicate of the answer referenced in the comment, since the link is for spring MVC, and this question is for .NET MVC.
I actually spent a few hours on this a while back, and came up with the following. This javascript hooks nicely with the unobtrusive jquery validation, and you can apply it to any form that has <code>&lt;input type=&quot;submit&quot;</code>. Note that it uses jquery 1.7's <code>on</code> function:
<pre><code>$(document).on('invalid-form.validate', 'form', function () {
 var button = $(this).find(':submit');
 setTimeout(function () {
 button.removeAttr('disabled');
 }, 1);
});
$(document).on('submit', 'form', function () {
 var button = $(this).find(':submit');
 setTimeout(function () {
 button.attr('disabled', 'disabled');
 }, 0);
});
</code></pre>
The setTimeouts are needed. Otherwise, you could end up with a button that is disabled after clicked even when client-side validation fails. We have this in a global javascript file so that it is automatically applied to all of our forms.
Update 16 Nov 2020 by <a href="https://stackoverflow.com/users/1178572/seagull">@seagull</a> :
Replaced selector <code>input[type=&quot;submit&quot;]</code> with <code>:submit</code> so it will work with <code>&lt;button type=&quot;submit&quot; /&gt;</code> as well

blocks|key|61330|text|通过JavaScript禁用该按钮很好，但如果用户禁用了该按钮或绕过了该按钮，该怎么办？如果你使用客户端安全性，那么就用服务器端来备份它。我会在这里使用PRG+pattern。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|61331|entityMap|0|LINK|mutability|MUTABLE|url|http://en.wikipedia.org/wiki/Post/Redirect/Get^0|24|B|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

Disabling the button is fine via JavaScript but what if the user has it disabled or they bypass it? If you use client side security then back it up with server side. I would use the <a href="http://en.wikipedia.org/wiki/Post/Redirect/Get" rel="nofollow">PRG pattern</a> here.

blocks|key|263106|text|你可以使用html.BeginForm的ajax.BeginForm+insted来实现这一点，如果你使用OnBegin的OnSuccess+insted，你可以确保你的方法成功执行，之后你的按钮变成停用，使用ajax你可以停留在当前视图中，并且你可以更新你的当前视图而不是重定向|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|263107|@using+(Ajax.BeginForm(
new+AjaxOptions
{
++++HttpMethod+=+"post",
++++InsertionMode+=+InsertionMode.Replace,
++++UpdateTargetId+=+"dive",
++++OnBegin="deactive"
}))
{
//body+of+your+form+same+as+Html.BeginForm
<input+type="submit"+id="Submit"+value="Submit"+/>
}|code-block|syntax|javascript|263108|并在表单中使用此jquery：|263109|<script+type="text/javascript"+language="javascript">+function+deactive()+{+$("#Submit").attr("disabled",+true);+}</script>|263110|使用ajax时要小心，必须在页面末尾调用此脚本|263111|<script+src="~/Scripts/jquery.unobtrusive-ajax.js"></script>|263112|entityMap^0|1H|7|1P|9|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@$9|V|A|W|B|C]|$9|X|A|Y|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|Z|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|10|8|@]|D|@]|E|$]]|$1|M|3|N|5|H|7|11|8|@]|D|@]|E|$I|J]]|$1|O|3|P|5|6|7|12|8|@]|D|@]|E|$]]|$1|Q|3|R|5|H|7|13|8|@]|D|@]|E|$I|J]]|$1|S|3|-4|5|6|7|14|8|@]|D|@]|E|$]]]|T|$]]

You can use ajax.BeginForm insted of html.BeginForm to achieve this, if you use <code>OnSuccess</code> insted of <code>OnBegin</code> you can be sure that your method execute successful and after that your button turn to deactivate,with ajax you stay
in current view and you can update your current view instead of redirection

<pre><code>@using (Ajax.BeginForm(
new AjaxOptions
{
 HttpMethod = "post",
 InsertionMode = InsertionMode.Replace,
 UpdateTargetId = "dive",
 OnBegin="deactive"
}))
{
//body of your form same as Html.BeginForm
&lt;input type="submit" id="Submit" value="Submit" /&gt;
}
</code></pre>

and use this jquery in your form:

<pre><code>&lt;script type="text/javascript" language="javascript"&gt; function deactive() { $("#Submit").attr("disabled", true); }&lt;/script&gt;
</code></pre>

be careful for using ajax you have to call this scrip in the end of your page

<pre><code>&lt;script src="~/Scripts/jquery.unobtrusive-ajax.js"&gt;&lt;/script&gt;
</code></pre>

blocks|key|61397|text|你可以用这个。它包括不起眼的jQuery验证。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|61398|$(document).on('submit',+'form',+function+()+{
++++var+buttons+=+$(this).find('[type="submit"]');
++++if+($(this).valid())+{
++++++++buttons.each(function+(btn)+{
++++++++++++$(buttons[btn]).prop('disabled',+true);
++++++++});
++++}+else+{
++++++++buttons.each(function+(btn)+{
++++++++++++$(buttons[btn]).prop('disabled',+false);
++++++++});
++++}+});|code-block|syntax|javascript|61399|对于jQuery验证，请包括|61400|~/Scripts/jquery.validate.min.js
~/Scripts/jquery.validate.unobtrusive.min.js|61401|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

You can use this one. It includes unobtrusive jQuery validation.

<pre><code>$(document).on('submit', 'form', function () {
 var buttons = $(this).find('[type="submit"]');
 if ($(this).valid()) {
 buttons.each(function (btn) {
 $(buttons[btn]).prop('disabled', true);
 });
 } else {
 buttons.each(function (btn) {
 $(buttons[btn]).prop('disabled', false);
 });
 } });
</code></pre>

For jQuery validation please incllude

<pre><code>~/Scripts/jquery.validate.min.js
~/Scripts/jquery.validate.unobtrusive.min.js
</code></pre>

blocks|key|1279965|text|使用mvc客户端验证的mvc应用程序的解决方案应该是：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1279966|$('form').submit(function+()+{
++++if+($(this).valid())+{
++++++++$(':submit',+this).attr('disabled',+'disabled');
++++}
});|code-block|syntax|javascript|1279967|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

The solution for mvc applications with mvc client side validation should be:

<pre><code>$('form').submit(function () {
 if ($(this).valid()) {
 $(':submit', this).attr('disabled', 'disabled');
 }
});
</code></pre>

blocks|key|61442|text|window.onload+=+function+()+{
++++++++++++$("#formId").submit(function()+{//+prevent+the+submit+button+to+be+pressed+twice
++++++++++++++++$(this).find('#submitBtnId').attr('disabled',+true);
++++++++++++++++$(this).find('#submitBtnId').text('Sending,+please+wait');
++++++++++++});
++++++++}|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|61443|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>window.onload = function () {
 $(&quot;#formId&quot;).submit(function() {// prevent the submit button to be pressed twice
 $(this).find('#submitBtnId').attr('disabled', true);
 $(this).find('#submitBtnId').text('Sending, please wait');
 });
 }
</code></pre>

I am rendering a form in Asp.net MVC with a submit button. The page redirects after successful record addition into the database. Following is the code :-

<pre><code>[HttpPost]
public ActionResult Create(BrandPicView brandPic)
{
 if (ModelState.IsValid)
 {
 if (!String.IsNullOrEmpty(brandPic.Picture.PictureUrl))
 {
 Picture picture = new Picture();
 picture.PictureUrl = brandPic.Picture.PictureUrl;
 db.Pictures.Add(picture);
 brandPic.Brand.PictureId = picture.Id;
 }
 db.Brands.Add(brandPic.Brand);
 db.SaveChanges();
 return RedirectToAction("Index");
 }
 return View();
}
</code></pre>

But, while testing, I saw that if the form is clicked again and again, the multiple entries are submitted and saved into the database. 

How can i make sure that if the form has been submitted once to the server, then no duplicates are submitted.

Avoiding Duplicate form submission in Asp.net MVC by clicking submit twice

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我在Asp.net MVC中呈现一个带有提交按钮的表单。成功将记录添加到数据库后，页面将重定向。以下是代码：[HttpPost]public ActionResult Create(BrandPicView brandPic){    if (ModelState.IsValid)    {        if (!S...

问通过单击两次提交来避免在Asp.net MVC中重复提交表单。
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问通过单击两次提交来避免在Asp.net MVC中重复提交表单。EN