Easyui 遮罩实现方式
项目中在提交Ajax请求时,后台处理数据时间有点长,需要一个遮罩,就随便找了一个实现一下:包含两种方式,个人比较喜欢第二种
第一种:
- $("#saveMaterial").click(function(){
- $.messager.progress({
- title:'请稍后',
- msg:'数据保存中...'
- });
- var url = PREFIX_LOCATION+"/cpv3MaterialCtrl/saveMaterial";
- var params = {
- "quotationId":quotationId,
- "universities":QUOTATIONMATERIAL.universities,
- "universityChange":QUOTATIONMATERIAL.universityChange
- };
- $.post(url,{params:JSON.stringify(params)},function(data){
- if(data && data.flag) {
- QUOTATIONMATERIAL.universities = [];
- opener.CostPage.initAndRefresh(true);
- $.messager.progress('close');//处理完成之后关闭
- $.messager.alert("操作提示",data.message,"info", function() {
- window.close();
- });
- } else {
- $.messager.progress('close');
- $.messager.alert("操作提示",data.message,"error");
- }
- },"json");
- });
效果如图:
第二种:
- $.messager.confirm("提示","确认要生成版本么?",function(action){
- if(action){
- $("<div id=\"procss\" class=\"datagrid-mask\"></div>").css({display:"block",width:"100%",height:$(window).height()}).appendTo("body");
- $("<div id=\"procssMark\" class=\"datagrid-mask-msg\"></div>").html("正在生成报价单版本...").appendTo("body").css({display:"block",left:($(document.body).outerWidth(true) - 190) / 2,top:($(window).height() - 45) / 2});
- /*$.messager.progress({
- title:'请稍后',
- msg:'正在生成报价单版本...'
- });*/
- $.ajax({
- url : '${ctx}/cpv3QuotationCtrl/createVersion?projectId='+projectId+'"ationId='+data[0].QUOTATION_ID,
- type : "get",
- cache : false,
- success : function(back) {
- if (back.flag) {
- //$.messager.progress('close');
- $("#procss").remove();//处理完之后移除
- $("#procssMark").remove();//处理完成之后移除
- $.messager.alert("提示信息","版本创建成功!","info");
- $("#personManage").datagrid("reload");
- } else {
- alert(back.message);
- }
- },
- error : function(back) {
- CDialog("操作失败:ajax返回异常");
- }
- });
- }
- })
效果如图
Easyui 遮罩实现方式的更多相关文章
- EasyUI Tree递归方式获取JSON
最近需要用到EASYUI中的TREE功能,以前我是直接拼接成<UL><LI>发现这样拼完之后在更改树后对树的刷新不是很理想,现改用JSON格式,首先分析TREE中JOSN格式如 ...
- easyui 生成tas方式
1.采用<a>标签形式 <div id="tabs" style="width:100%;"> <ul> <li id ...
- EasyUI Tabs + Yii2.0实现iframe方式打开页面(解决共用静态文件引入加载的问题)
在项目实际开发中,有将打开的各个链接页面隔离的需求(防止静态资源起冲突),这个时候常规思路就是使用iframe来实现!但遇到一个比较棘手的问题,当用easyui Tabs打开一个iframe页面时,怎 ...
- springMVC注解方式+easyUI+MYSQL配置实例
刚接触springMVC,使用的注解方式,也在学习阶段,所以把自己学习到的记下来.本文利用springMVC从数据库读取用户信息为例,分享一下. 1.准备相关架包及资源.因为使用springMVC+e ...
- 基于MVC4+EasyUI的Web开发框架经验总结(6)--在页面中应用下拉列表的处理
在很多Web界面中,我们都可以看到很多下拉列表的元素,有些是固定的,有些是动态的:有些是字典内容,有些是其他表里面的名称字段:有时候引用的是外键ID,有时候引用的是名称文本内容:正确快速使用下拉列表的 ...
- 基于jeasyui的遮罩扩展[修复链式bug]
说明和使用方法看下面代码,直接复制下面代码保存为js文件,引用即可. 遮罩效果从datagrid中提取,针对jquery进行优化. 下载地址(附Demo):http://pan.baidu.com/s ...
- Easyui 基于kindeditor的扩展
源码 /** * Author : ____′↘夏悸 * Easyui KindEditor的简单扩展. * 有了这个之后,你就可以像使用Easyui组件的方式使用KindEditor了 * 前提是你 ...
- JQuery EasyUI学习记录(三)
1.jQuery EasyUI messager使用方式 1.1 alert方法 $(function(){ //1.alert方法---提示框 $.messager.alert("标题&q ...
- (转)基于MVC4+EasyUI的Web开发框架经验总结(6)--在页面中应用下拉列表的处理
http://www.cnblogs.com/wuhuacong/p/3840321.html 在很多Web界面中,我们都可以看到很多下拉列表的元素,有些是固定的,有些是动态的:有些是字典内容,有些是 ...
随机推荐
- Lua顺序 执行顺序
1.4.2. Lua顺序 Nginx下Lua处理阶段与使用范围: init_by_lua http set_by_lua server, server if, location, location i ...
- 开发GPIO驱动的基本套路
最近完成了基于AR9331的GPIO驱动的开发,主要包括:控制一个连接GPIO的灯控:接收一个连接GPIO的按键事件:以及接收一个连接GPIO的脉冲事件. 这里,结合开发实践,总结一下GPIO驱动开发 ...
- Win10:如何修改双网卡的优先级?
很多使用双网卡的IT之家网友可能遇到一种情况,比如笔记本电脑在插上网线后还是用WiFi,得手动关闭无线连接才能转换到有线连接.如何才能调整合适的网络优先级呢?一般来说,有两种方法比较常用. 一.调整网 ...
- Discuz! X 插件开发手册
文件命名规范 Discuz! 按照如下的规范对程序和模板进行命名,请在设计插件时尽量遵循此命名规范: 可以直接通过浏览器访问的普通程序文件,以 .php 后缀命名. 被普通程序文件引用的程序文件, ...
- jenkins登录使用cas认证
jenkins是目前打包管理项目最牛的工具.http://192.168.35.50:4000/jenkins%20plugin/system/74-cas-plugin.html
- java后台如何根据表单中input的顺序获取value值
如果java后台准备用Servlet来实现,可以直接在doPost( )或者doGet( )中使用如下语句:request.setCharacterEndoding("UTF-8" ...
- Mysql事务-隔离级别
MYSQL事务-隔离级别 事务是什么? 事务简言之就是一组SQL执行要么全部成功,要么全部失败.MYSQL的事务在存储引擎层实现. 事务都有ACID特性: 原子性(Atomicity):一个事务必须被 ...
- 理解和使用WPF 验证机制(值得推荐)
首先建立一个demo用以学习和实验WPF Data Validation机制.创建一个数据实体类: public class Employee { public string Name { get; ...
- day9笔记--文件操作
文件操作 计算机系统分为:计算机硬件,操作系统,应用程序三部分. 我们用python或其他语言编写的应用程序若想要把数据永久保存下来,必须要保存于硬盘中,这就涉及到应用程序要操作硬件,众所周知,应用 ...
- Gradle5.x打jar包上传maven仓库
1.上传本地仓库 1.1 build.gradle 项目设置 plugins { id 'java' id 'maven' //引入maven插件 } group 'com.inkyi' //包名 v ...