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在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没 ...
随机推荐
- hdu 6071 Lazy Running 最短路建模
Lazy Running Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 524288/524288 K (Java/Others) P ...
- CentOS6.5使用yum快速搭建LAMP环境
1.安装Apache # yum -y install httpd # 开机自启动 # chkconfig httpd on # 启动httpd 服务 # service httpd start # ...
- async await 多线程
async await 并没有开启多线程 出现await的地方 只是开启了一个子线程继续往后执行 主线程返回 防止阻塞 相当于 await customerRepository.getall() ...
- 分布式系统的唯一id生成算法你了解吗?
在分库分表之后你必然要面对的一个问题,就是id咋生成? 因为要是一个表分成多个表之后,每个表的id都是从1开始累加自增长,那肯定不对啊. 举个例子,你的订单表拆分为了1024张订单表,每个表的id都从 ...
- js判断安卓客户端或者是ios客户端,是否是微信浏览器
代码: function xaizai() { var u = navigator.userAgent, app = navigator.appVersion; var isAndroid = ...
- causal snps | causal variants | tensorflow | 神经网络实战 | Data Simulation
先读几篇文章: Interpretation of Association Signals and Identification of Causal Variants from Genome-wide ...
- Python中字典和集合的用法
本人开始学习python 希望能够慢慢的记录下去 写下来只是为了害怕自己忘记. python中的字典和其他语言一样 也是key-value的形式 利用空间换时间 可以进行快速的查找 key 是唯一的 ...
- 关于Handler中Message的创建问题
Message用来定义一个包含任意数据的消息对象,这个消息对象是可以被发送给Handler处理的. 我们最好通过Message.obtain()和Handler.obtatinMessage()来得到 ...
- JSX语法
什么是JSX语法:就是符合 xml 规范的 JS 语法:(语法格式相对来说,要比HTML严谨很多) 1. 如何启用 jsx 语法? 安装 `babel` 插件 - 运行`cnpm i babel-co ...
- z-index注意事项
1. z-index只对定位元素有效(如position:absolute!) 2. 被覆盖的元素将无法触发其鼠标相关事件.(个人经验,可能有例外.) 3. 无法通过z-index使父级覆盖子级,如果 ...