easyUI的form表单重复提交处理
1. 问题
生产环境出现过新增用户提交, 入库两条重复数据的情况; 但是我查看代码, 页面做了校验, 后台插入数据也做了校验; 出现这种几率的事件的非常小的, 但是还是会碰到
2. 解决办法
其实根本原因还是用户提交注册表单发生了重复提交, 只要杜绝重复提交就可以了; 所以提交表单之前加入遮罩层来解决, 代码如下:
function submit(){
if(!$("#form").form('validate')){
return false;
}
$('body').masked('load', '提交中...'); // 遮罩层
Ajax.request({
url: addUserUrl;
params:$("#form").serialize(),
async:false,
ok:function(data){
$("body").masked("unload"); // 请求完成才去掉遮罩层
tip('新增用户成功!');
er:function(data){
$("body").masked("unload");
tip('新增用户失败!');
}
});
}
3. masked 这个需要去jquery进行扩展功能
(function($) { //加载遮罩层
function load(target, msg){
if(!$(target).children("div.mine-mask").length){
$("<div class=\"mine-mask\" style=\"display:block;z-index:999999;\"></div>").appendTo($(target));
var $msg = $("<div class=\"mine-mask-msg\" style=\"display:block;left:50%;z-index:1000000;\"></div>").html(msg).appendTo($(target));
$msg.height(20);
$msg.css({
marginLeft : (-$msg.outerWidth() / 2),
lineHeight : ($msg.height() + "px")
});
}
} //移除遮罩层
function unload(target){
$(target).children("div.mine-mask").remove();
$(target).children("div.mine-mask-msg").remove();
} $.fn.masked = function(methodname, param) {
var method = $.fn.masked.methods[methodname];
if (method) {
return method(this, param);
} else {
return null;
}
}; $.fn.masked.methods = {
load : function(jq, msg) {
msg = msg || $.fn.masked.defaults.msg;
return jq.each(function() {
load(this, msg);
});
},
unload : function(jq) {
return jq.each(function() {
unload(this);
});
}
}; $.fn.masked.defaults = $.extend({}, {
msg : "数据加载中..."
});
})(jQuery);
easyUI的form表单重复提交处理的更多相关文章
- 使用js控制表单重复提交(1加锁,2事件方式,3 EasyUI中解决表单重复提交)
方法一. var flag = true; $(function() { $("#interested").click(function() { beInterested(); } ...
- JavaWeb学习总结(十一):Session解决form表单重复提交
在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...
- js阻止form表单重复提交
防止表单重复提交的方法总体来说有两种,一种是在js中阻止重复提交:另一种是在后台利用token令牌实现,大致思路是生成一个随机码放到session和form表单的隐藏输入框中,提交表单时两者对比,表单 ...
- php 解决和避免form表单重复提交的方法
在提交表单的时候,可能遇到网速等导致页面突然加载变慢,用户重复地点击提交按钮,将在数据库产生多条数据,导致不可控情况. 比如下面的情况就会导致表单重复提交: 点击提交按钮两次. 点击刷新按钮. 使用浏 ...
- form表单重复提交,type=“button”和type=“submit”区别
公司测试提了一个项目后台在IE浏览器下(360,firefox就没问题)出现数据重复的问题,调试了好久终于发现问题所在,也不知道是谁写的代码,醉醉的.... 错误地点: <input type= ...
- java web学习总结(十三) -------------------使用Session防止表单重复提交
在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...
- JavaWeb防止表单重复提交(转载)
转载自:http://blog.csdn.net/ye1992/article/details/42873219 在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用 ...
- JavaWeb---总结(十三)使用Session防止表单重复提交
在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...
- [Java拾遗五]使用Session防止表单重复提交
申明:此文章属于转载, 转自博客: http://www.cnblogs.com/xdp-gacl/p/3859416.html在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没 ...
随机推荐
- C#深入多线程
主线程: th = Thread.CurrentThread; //现在的线程为主线程 th.Name = "MainThread"; //set线程名字:主线程本身没有名字 th ...
- [从零开始搭网站四]CentOS配置Tomcat
点击下面连接查看从零开始搭网站全系列 从零开始搭网站 上一章带大家配置了JDK,那么现在就要来配置Tomcat容器了. 1:去 http://tomcat.apache.org/download-90 ...
- 性能跃升50%!解密自主研发的金融级分布式关系数据库OceanBase 2.0
小蚂蚁说: 相信大家对蚂蚁金服自主研发的金融级分布式关系数据库OceanBase的故事不再陌生了.在刚刚过去的2018年天猫双11中,成交额2135亿再次创造了新纪录,而支撑今年双11的支付宝核心链路 ...
- C++.运行时类型判断_测试代码
ZC:C++ 编程思想——运行时类型识别 - 浅墨浓香 - 博客园.html(https://www.cnblogs.com/5iedu/articles/5585895.html) -------- ...
- 《剑指offer》第五十三题(0到n-1中缺失的数字)
// 面试题53(二):0到n-1中缺失的数字 // 题目:一个长度为n-1的递增排序数组中的所有数字都是唯一的,并且每个数字 // 都在范围0到n-1之内.在范围0到n-1的n个数字中有且只有一个数 ...
- MySQL学习(七)
学习子查询 1 查出本网站最新的good_id最大的一条商品(要求取出商品名) mysql> select goos_id,goods_name from goods -> order b ...
- 牛客网NOIP赛前集训营-提高组(第一场)B 数数字
数数字 思路: 数位dp 代码: #pragma GCC optimize(2) #pragma GCC optimize(3) #pragma GCC optimize(4) #include< ...
- Codeforces Gym - 101102A - Coins
A. Coins 题目链接:http://codeforces.com/gym/101102/problem/A time limit per test 3 seconds memory limit ...
- python中文件的读和写操作
一.打开文件 data = open("yesterday",encoding="utf-8").read() # python默认的打字符编码是unicode ...
- Vue.js示例:树型视图; 模式组件;
树型图 本示例是一个简单的树形视图实现,它展现了组件的递归使用. mycode pen:https://codepen.io/chentianwei411/pen/KGKQxE 重点:递归是如何形成的 ...