javascript实现上传和下载

使用easyui进行文件上传

HTML代码

<form id ="uploadform"  style="display:inline-flex;">
                     <input class="easyui-filebox" name="file" id = "file" onfocus=this.blur() data-options="prompt:'Choose a file...'" style="width:100%;">
                     <input name="_tf_token_" type="hidden" value="" id="tr_token"/>
                     <input type="button" value="导入" onclick="doUpload()"
                      class="button"/>
                     </form>

Javascript代码

function doUpload() {
    $('#tr_token').val(tokenValue); // 获取全局token值
    var file  = $( "#filebox_file_id_1" ).val(); // filebox_file_id_1 是easyui生成的id
    // 判断上传的文件格式
    var filetype = file.substr(file.length-4,file.length);
    if(!(filetype.indexOf("csv")>0)){
        alertMsg("上传的文件格式出错,请按照模板上传");
        return;
    }
    /// 获取文件数据
    var formData = new FormData($( "#uploadform" )[0]);
    console.log(formData);
    $('#dataGrid').datagrid("loading");
    if(file){
        alertMsg("确认导入文件?", "", null, function(){
            $.ajax({
                 url: '../AllLimitManageC/addImportRiskBlacklist',
                 type: 'POST',
                 data:formData,
                 dataType : "json",
                 async: false,
                 cache: false,
                 contentType: false,
                 processData: false,
                 success: function (data) {
                     var data = formatJson(globalHtmlCharDecode(data));
                     if(data.result =="success"){
                        alertMsg(data.msg);
                        $('#dg').datagrid('loadData',data);    
                        $("#dg").datagrid("loaded"); //移除屏蔽
                     }else{
                        alertMsg(data.msg, "", null, null);
                        $("#dg").datagrid('loadData', {total:0,rows:[]});
                        $("#detailPanelIndividual").panel('close');
                        $("#detailPanelCompany").panel('close');
                        $("#formWindow").window('close');
                     }

                 },
                 error: function (returndata) {
                     alertMsg(data.msg);
                 }
            });
        }); 
    } else {
        alertMsg("请先选择文件", "", null, null);

    }

}

前端页面展示
这里写图片描述

操作 :
这里写图片描述

下载 :

 // 下载列表
    function downloadTable(tablename){
        var arr =  tablename.split("_");
        var downfilename =  "monthaccount"+"_"+arr[1]+".xls";
        var _url = [];
        var downurl = "../daliyMainc/downloadExcel"
        _url.url = downurl;
        _url.dataType = "json";
        _url.contentType= "application/x-www-form-urlencoded; charset=utf-8";
        _url.type = "post";
        _url.data = {
            "downfilename":downfilename,
        };
        _url.callback = function (data){
            if(data.result == "success"){
              alertMsg("下载成功");
            } else {
                alertMsg(data.msg);
            }
        };
        _url.errorCallback = function(data){
            if(data.readyState == 4 && data.status == 200){
            // 使用post请求最后还会走这个。。。奇怪!
                window.location.href= downurl + "?downfilename="+downfilename;
            }else{
                alertMsg("系统异常");
            }
        };
        getEasyUiJson(_url);
    }
  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值