文件上传upload.render小记


upload.render失效

  • 遇到的问题:
  • 正确代码如下:
  • 分析错误代码:

遇到的问题:

初始化时能正常打开上传,但点击查询后上传按钮失效

  • 代码是渲染页面在后,赋值调用loadLayerEL方法在前,但此时页面的这些值是没有给到的,直接调用上传按钮,此时是不起作用的,需要先给页面渲染,再去调用

if(paramPage>0){
    var curr=paramPage;
}else{
    var curr = 1;    
}
var pageSize = 10;
$(function() {
    find(curr);
})
function find(currs) {
    if(currs!=null){
        curr = currs;
    }
    var examType = $("#examType").val();
    var year = $("#year").val();
    var term = $("#term").val();
    $.ajax({
        url : ctx + "/ScoreRegistration/queryCourse",
        type : "post",
        data : {
            "pageNum" : curr,
            "pageSize" : pageSize,
            "year" : year,
            "term" : term,
            "examType":examType
        },
        dataType : "json",
        async : true,
        contentType : "application/x-www-form-urlencoded",
        success : function(result) {
            if(result.code!="-1"){
                $("#no_data").hide();
                $("#table_div").show();
                $("#t_body_class").html("");
                var courseList = result.data.list;
                for (var i = 0; i < courseList.length; i++) {
                    var str = "";
                    var inde = ((10*(curr-1))+i+1);
                    str += ""+((10*(curr-1))+i+1)+""
                    str += ""+courseList[i].grade+"";
                    str += ""+courseList[i].yearTerm+"";
                    str += ""+courseList[i].className+"";
                    str += ""+courseList[i].courseName+"";
                    str += ""+courseList[i].teacherName+"";
                    str += ""+courseList[i].auditStatus+"";
                    if(courseList[i].auditStatus=='未录入'){
                        str += "" +"" 
                        +"";
                    }else if(courseList[i].auditStatus=='录入中'){
                        str += "" +""+"";
                    }
                    str+="";
                    $("#t_body_class").append(str);
                    loadLayerEL(inde,courseList[i].grade,year,term,courseList[i].courseId,courseList[i].teacherId,courseList[i].classId,courseList[i].majorId,courseList[i].deptId,courseList[i].majorName,courseList[i].deptName,courseList[i].courseName)
                }
            }else{
                $("#no_data").show();
                $("#table_div").hide();
            }
            layui.use(['laypage', 'layer'], function(){
                var laypage = layui.laypage,
                layer = layui.layer;
                laypage({
                    cont:'demo7',
                    pages : result.data.pages,
                    skip : true,
                    curr : curr,
                    jump : function(obj, first) {
                        newpage = obj.curr;
                        if (!first) {
                            find(newpage);
                        }
                    }
                });
             })
        }
    });
}
/**
 * 加载layer的依赖
 * @returns
 */
var  files = null;
function loadLayerEL(inde,grade,year,term,courseId,teacherId,classId,majorId,deptId,majorName,deptName,courseName){
    var params = {
    "grade":grade,
    "year":year,
    "term":term,
    "courseId":courseId,
    "teacherId":teacherId,
    "classId":classId,
    "examType":examType,
    "majorId":majorId,
    "deptId":deptId,
    "page":curr
}
    
    layui.use(['element','upload','form'], function(){
          var element = layui.element;
          var $ = layui.jquery,upload = layui.upload;
          /*上传文件*/
          upload.render({ //允许上传的文件后缀
                elem: '#upload_excel_'+inde,
                url: ctx+'/ScoreRegistration/importScholarStudent',
                accept: 'file', //普通文件,
                data: params,
                auto:true,//是否自动上传
                exts: 'xls|xlsx', //只允许上传excel文件
                progress: function(n, elem){
                    var percent = n + '%' //获取进度百分比
                    element.progress('#upload_excel_'+inde, percent);
                    console.log(elem); 
                },
                done: function(res){//上传完成后回调
                    deletefile();
                    if(res.msg=="请求上传接口出现异常"){
                        layer.msg("请检查上传表格中数据");
                        return false;
                    }else{
                        layer.msg(res.msg,{time:5000});
                        find(1);
                    }
                },
                choose:function(obj){
                    deletefile();
                    //将每次选择的文件追加到文件队列
                     files = obj.pushFile();
                   }
          });
    });
}

/**
 * 清除文件
 * @returns
 */
function deletefile(){
    if(null != files){
        for(var i = 0 ; i){
            delete  files[Object.keys(files)[i]];
        }
        files = null;
    
    }
}