//放于上传前
function ajaxLoading(){
$("<div class=\"datagrid-mask\"></div>").css({display:"block",width:"100%",height:$(window).height()}).appendTo("body");
$("<div class=\"datagrid-mask-msg\"></div>").html("正在上传,请稍候。。。").appendTo("body").css({display:"block",left:($(document.body).outerWidth(true) - 190) / 2,top:($(window).height() - 45) / 2});
} //放于状态返回后
function ajaxLoadEnd(){
$(".datagrid-mask").remove();
$(".datagrid-mask-msg").remove();
}
function import(){
ajaxLoading();
$.ajaxFileUpload({
url:'import.do',
fileElementId:'importFile',
type:'post',
dataType : 'json',
secureuri : false,
success:function(data){
ajaxLoadEnd();
if(data&&data.code=="200"){
$.messager.show({
title:'提示',
msg:'用户导入成功!',
timeout:5000,
showType:'slide'
});
}
$('#table).datagrid('reload');
return;
},
error: function(data, status, e) { //提交失败自动执行的处理函数。
ajaxLoadEnd();
if(data&&data.message){
$.messager.alert("警告",data.message);
}else{
$.messager.alert("警告","导入失败,请联系相关人员");
}
}
});
}

导入控件

<input type="file" id="importFile" name="importFile" />
<a class="easyui-linkbutton" onclick="import()">批量导入用户</a>

效果就是  点击一次上传, 当上传操作结束后  才能操作界面

ajaxfileuplod 上传文件 essyui laoding 效果,防止重复上传文件的更多相关文章

  1. 用html5文件api实现移动端图片上传&预览效果

    想要用h5在移动端实现图片上传&预览效果,首先要了解html5的文件api相关知识(所有api只列举本功能所需): 1.Blob对象  Blob表示原始二进制数据,Html5的file对象就继 ...

  2. JS兼容各个浏览器的本地图片上传即时预览效果

    JS兼容各个浏览器的本地图片上传即时预览效果 很早以前 在工作曾经碰到这么一个需求,当时也是纠结了很久,也是google了很久,没有碰到合适的demo,今天特意研究了下这方面的的问题,所以也就做了个简 ...

  3. MVC图片上传、浏览、删除 ASP.NET MVC之文件上传【一】(八) ASP.NET MVC 图片上传到服务器

    MVC图片上传.浏览.删除   1.存储配置信息 在web.config中,添加配置信息节点 <appSettings> <add key="UploadPath" ...

  4. 数据存入hive数据表之前对.csv(数据集)文件的预处理以及数据的上传

    对于数据集文件,在将其中的数据存入hive之前,需要将数据进行预处理. 1.删除文件第一行记录,即字段名称 sed -i '1d' raw_user //1d表示删除第1行,同理,3d表示删除第3行, ...

  5. SpringMVC 实现POI读取Excle文件中数据导入数据库(上传)、导出数据库中数据到Excle文件中(下载)

    读取Excale表返回一个集合: package com.shiliu.game.utils; import java.io.File; import java.io.FileInputStream; ...

  6. 利用ThinkPHP自带的七牛云驱动上传文件到七牛云以及删除七牛云文件方法

    一.准备工作 1.注册七牛云账号 2.选择对象储存->创建空间->设置为公开 3.在config配置文件中添加以下代码 'UPLOAD_FILE_QINIU' => array ( ...

  7. phonegap文件,目录操作以及网络上传,下载文件(含demo)

    正在做一个跨平台的应用,需要使用phonegap进行文件的一些基本操作. 需求如下:可以选择本地图片,或者从相机选择图片,并进行显示在本地,然后上传到服务器,以及可以从服务器下载图片显示出来,如果本地 ...

  8. WebAPI通过multipart/form-data方式同时上传文件以及数据(含HttpClient上传Demo)

    简单的Demo,用于了解WebAPI如何同时接收文件及数据,同时提供HttpClient模拟如何同时上传文件和数据的Demo,下面是HttpClient上传的Demo界面 1.HttpClient部分 ...

  9. 基础教程:上传/下载ASP.NET Core 2.0中的文件

    问题 如何上传和下载ASP.NET Core MVC中的文件. 解 在一个空的项目中,更新 Startup 类以添加MVC的服务和中间件. publicvoid ConfigureServices( ...

随机推荐

  1. 08-图8 How Long Does It Take (25 分

    Given the relations of all the activities of a project, you are supposed to find the earliest comple ...

  2. myeclipse 上安装 Maven

    myeclipse 上安装 Maven3   环境准备: JDK 1.6 Maven 3.0.4 myeclipse 8.6.1 安装 Maven 之前要求先确定你的 JDK 已经安装配置完成.Mav ...

  3. windows 7 elasticsearch-5.3.2

    # windows elasticsearch- D:\nescafe\elasticsearch-\bin λ java -version java version "1.8.0_121& ...

  4. Eclipse与异常处理

    快捷键:Ctrl+d删除光标所在的这一行 Alt+/ 智能提示 异常处理 异常是阻止当前方法或作用域继续执行的问题,在程序中导致程序中断运行的一些指令. try与catch关键字 try{ //有可能 ...

  5. jdbc操作步骤

    package com.itheima.test; import java.sql.Connection; import java.sql.DriverManager; import java.sql ...

  6. RN 从上手到“放弃”

    RN 从上手到"放弃" 前言: react-native,相对于最近

  7. linux下的rpm软件包,rpm源码包和tar安装包

    Linux下的软件包是一个独立的程序,用于Linux系统的包管理.在Linux下,软件包的安装方式很多样,不如Windows下的软件安装简单,Windows下基本上就是傻瓜式下一步下一步,而Linux ...

  8. cucumber的疑问解答

    在cucumber的自动化测试框架下面,在一个steps文件中定义的@page对象,可以在其他的不同的steps文件中调用,在整个的场景生命周期中都是有效的 原因:cucumber开始执行时,一次性把 ...

  9. ElasticSearch安装和核心概念

    1.ElasticSearch安装 elasticsearch的安装超级easy,解压即用(要事先安装好java环境). 到官网 http://www.elasticsearch.org下载最新版的 ...

  10. ios下表单disabled样式重置

    在做最近的一个活动项目时,需要用到表单的disabled状态,但是在IOS下那颜色不是一般的浅,就跟没有一样,一开始通过如下样式重置: input:disabled, input[disabled]{ ...