如何防止用户双击我的注册表单(ajax部分视图)上的提交按钮
我很遗憾地问,因为这个问题早就被问过了。我只是找不到一个明确可行的答案,不管我在哪里搜索。禁用该按钮将阻止提交。使用var javascript clickcount+alert+return_false不会重置。
环境:asp.net mvc3
视图:加载时表单显示:@RenderPage("_SignupForm.cshtml")
提交使用:
@using (Ajax.BeginForm("Index", "Signup", null,
new AjaxOptions
{
UpdateTargetId = "signupForm",
InsertionMode = InsertionMode.Replace,
HttpMethod = "POST",
LoadingElementId="progress"
}
))
提交控制:<input type="submit" value="Sign up" />
注册控制器:
public ActionResult Index()
{
return View();
}
[HttpPost]
public ActionResult Index(SignupModel formvalues)
{
Thread.Sleep(5000);
string errors = "";
if (TryValidateModel(formvalues))
{
errors = SignupAPI.Signup(formvalues); //includes custom validation
}
if (ModelState.IsValid == false || string.IsNullOrEmpty(errors) == false)
{
ViewBag.Errors = errors;
return PartialView("_SignupForm", formvalues);
}
else
return Redirect(string.Concat("http://localhost/welcome"));
}
尝试使用以下脚本:
$('form').submit(function () {
if ($(this).valid()) {
$(':submit', this).attr('disabled', 'disabled');
}
});
确保在AJAX请求的成功回调中也执行它,以便在表单被DOM中的新内容替换时,或者第二次它可能不再工作时,重新附加submit
事件。
更新:提交不起作用,因为onclick没有返回true
<input type="submit" value="Sign Up" onclick="this.disabled = true; return true;"/>
这将禁用该按钮,第二次单击该按钮将不起作用