嘿,大家好,今天我来介绍几种简单的防止表单重复提交的方法:
防止表单重复提交:
方法一:前端方式
当点击提交或者保存按钮之后,将按钮置为灰色或者不可点击状态,当Ajax回调之后,将按钮恢复
1.点击保存,进入保存的方法中,加上下面这个,将按钮置为不可点击状态
$("input.submitbutton").val("正在保存请稍后。。。。。。") $("input.submitbutton").attr("disabled","disabled");
2.当保存的Ajax回调成功恢复按钮状态,或者不需要直接刷新页面就好
$("input.submitbutton").removeAttr("disabled"); $("input.submitbutton").val("保存");缺点:当用户通过刷新页面方式,或使用postman等工具绕过前段页面仍能重复提交表单。因此不推荐此方法。
方法二:后端方式
给数据库中需要的字段增加唯一键约束(简单粗暴),然后在后端捕获异常,通过try...catch的方式返回异常信息
1.修改数据库,给需要的字段增加唯一约束(注:如果此时数据库中存在该字段的重复数据,则sql会执行不成功,需要你删除重复数据后执行sql)
2.在后端insert保存数据的位置,使用try...catch...代码块,捕获DuplicateKeyException异常,在catch中直接返回
@RequestMapping(value = "/saveUserPojo", method = {RequestMethod.GET}) @ResponseBody public Object saveUserPojo() { Map<String, Object> resultMap = new HashMap<String, Object>(); UserPojo userPojo = new UserPojo("1", "程序猿辉辉", 23); try { repeatedSubmitService.insert(userPojo); } catch (DuplicateKeyException e) { resultMap.put("code", "400"); resultMap.put("message", "请勿重复提交!!!"); } resultMap.put("code", "200"); resultMap.put("message", "保存成功"); return resultMap; }
3.在ajax回调函数用输出message(请勿重复提交!!!)
像上面的的两种方法是比较简单的方式,可以结合起来使用。另外防止表单重复提交的方式还有好多,比如利用Session防止表单重复提交,使用AOP自定义切入实现方式表单重复提交等等比较高端一点的方式,有兴趣的小伙伴可以尝试一下,有空我也在好好研究一下,大家共同学习进步,嘿嘿!
未完待续。。。
今天的更新到这里就结束了,拜拜!!!
感谢一路支持我的人,您的关注是我坚持更新的动力,有问题可以在下面评论留言或随时与我联系。。。。。。
QQ:850434439
微信:w850434439
EMAIL:gathub@qq.com
如果有兴趣和本博客交换友链的话,请按照下面的格式在评论区进行评论,我会尽快添加上你的链接。
网站名称:GatHub-HongHui'S Blog
网站地址:https://www.gathub.cn/
网站描述:不习惯的事越来越多,但我仍在前进…就算步伐很小,我也在一步一步的前进。
网站Logo/头像:[头像地址]
标签:重复,保存,resultMap,表单,提交,按钮 来源: https://www.cnblogs.com/gathub/p/repeated_submit.html
本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享; 2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关; 3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关; 4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除; 5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。