angularjs中$http异步上传Excel文件方法


Posted in Javascript onFebruary 23, 2018

1.文件上传框html代码如下

<form id="fileForm" enctype="multipart/form-data">
 <button id="import_asset" type="button" ng-click="import_asset()">上传文件</button>
 <input id="file_asset" type="file" style="display: none;"/>
</form>

*注意: 设置form的enctype属性值为:multipart/form-data

2:js代码如下:

$scope.import_asset = function () {
 $("#file_asset").click();
};
$("#file_asset").on("change", function(){
 var formData = new FormData();
 var file = document.getElementById("file_asset").files[0];
 if(file.name){
  var fileName = file.name.substring(file.name.lastIndexOf(".") + 1);
  if(fileName =="xlsx" || fileName =="xls"){
   formData.append('file', file);
   $http({
    method:"post",
    url:commonService.projectName + "/so/assetmanage/upload",
    data:formData,
    headers : {
     'Content-Type' : undefined
    },
    transformRequest : angular.identity
   }).then(function (response) {
    if(response.status == 200){
     alert("文件上传成功!!!");
    }else{
     alert("文件上传失败!!!");
    }
   });
  }else{
   alert("文件格式不正确,请上传以.xlsx,.xls 为后缀名的文件。");
   $("#file_asset").val("");
  }
 }
});
Javascript 相关文章推荐
jquery 表单进行客户端验证demo
Aug 24 Javascript
js实现div的切换特效上一个下一个
Feb 11 Javascript
ExtJS 刷新后如何默认选中刷新前最后一次选中的节点
Apr 03 Javascript
js实现图片从左往右渐变切换效果的方法
Feb 06 Javascript
zepto中使用swipe.js制作轮播图附swipeUp,swipeDown不起效果问题
Aug 27 Javascript
学习javascript的闭包,原型,和匿名函数之旅
Oct 18 Javascript
JavaScript学习总结之正则的元字符和一些简单的应用
Jun 30 Javascript
jquery+css实现下拉列表功能
Sep 03 jQuery
vue Element-ui input 远程搜索与修改建议显示模版的示例代码
Oct 19 Javascript
JS与jQuery判断文本框还剩多少字符可以输入的方法
Sep 01 jQuery
vue项目首屏加载时间优化实战
Apr 23 Javascript
vue基于Teleport实现Modal组件
May 31 Vue.js
浅谈vuejs实现数据驱动视图原理
Feb 23 #Javascript
Vue父组件调用子组件事件方法
Feb 23 #Javascript
vue实现密码显示隐藏切换功能
Feb 23 #Javascript
对vue.js中this.$emit的深入理解
Feb 23 #Javascript
基于vue.js中事件修饰符.self的用法(详解)
Feb 23 #Javascript
vue.js2.0点击获取自己的属性和jquery方法
Feb 23 #jQuery
vue中动态绑定表单元素的属性方法
Feb 23 #Javascript
You might like
PHP中的串行化变量和序列化对象
2006/09/05 PHP
php 上传文件类型判断函数(避免上传漏洞 )
2010/06/08 PHP
php计算到指定日期还有多少天的方法
2015/04/14 PHP
PHP中SQL查询语句的id=%d解释(推荐)
2016/12/10 PHP
Nigma vs AM BO3 第二场2.13
2021/03/10 DOTA
CL vs ForZe BO5 第四场 2.13
2021/03/10 DOTA
JavaScript的Function详细
2006/11/14 Javascript
YUI 读码日记之 YAHOO.lang.is*
2008/03/22 Javascript
jquery maxlength使用说明
2011/09/09 Javascript
javascript:文字不间断向左移动的实例代码
2013/08/08 Javascript
jQuery中获取checkbox选中项等操作及注意事项
2013/11/24 Javascript
jquery 快速回到页首的方法
2013/12/05 Javascript
如何编写高质量JS代码(续)
2015/02/25 Javascript
js表单处理中单选、多选、选择框值的获取及表单的序列化
2016/03/08 Javascript
微信小程序 获取当前地理位置和经纬度实例代码
2016/12/05 Javascript
nodejs实现发出蜂鸣声音(系统报警声)的方法
2017/01/18 NodeJs
node.js读取Excel数据(下载图片)的方法示例
2018/08/02 Javascript
解决vue初始化项目时,一直卡在Project description上的问题
2019/10/31 Javascript
JS+CSS实现3D切割轮播图
2020/03/21 Javascript
微信小程序实现选项卡滑动切换
2020/10/22 Javascript
python微信公众号之关键词自动回复
2018/06/15 Python
python获取指定日期范围内的每一天,每个月,每季度的方法
2019/08/08 Python
python 生成器需注意的小问题
2020/09/29 Python
基于Canvas+Vue的弹幕组件的实现
2019/07/23 HTML / CSS
英国著名的药妆网站:Escentual
2016/07/29 全球购物
公积金单位接收函
2014/01/11 职场文书
大学生个人实习的自我评价
2014/02/15 职场文书
人事任命通知书
2015/04/21 职场文书
2015年学校体育工作总结
2015/04/22 职场文书
小爸爸观后感
2015/06/15 职场文书
结婚典礼主持词
2015/06/29 职场文书
文明上网主题班会
2015/08/14 职场文书
导游词之上海东方明珠塔
2019/09/25 职场文书
JS Canvas接口和动画效果大全
2021/04/29 Javascript
Python制作动态字符画的源码
2021/08/04 Python
在Python 中将类对象序列化为JSON
2022/04/06 Python