danci/www.hanlinyuanonline.com/Application/Admin/View/Course/import.html

<!-- 头部 -->
<include file="Public/top" />
<div class="wrapper row-offcanvas row-offcanvas-left">
    <!-- Left side column. contains the logo and sidebar -->
    <aside class="left-side sidebar-offcanvas">
        <!-- 左边 -->
        <include file="Public/left" />
    </aside>

    <!-- Right side column. Contains the navbar and content of the page -->
    <aside class="right-side">
        <!-- Content Header (Page header) -->
        <!-- bar -->
        <include file="Public/bar" />

        <!-- Main content -->
        <!-- 右侧 -->
        <div class="row">
            <!-- left column -->
            <div class="col-md-12">
                <form method="post" id="myForm"   enctype="multipart/form-data">
                    <div class="box box-primary">
                        <div class="box-header">
                            <h3 class="box-title">单词导入</h3>
                        </div><!-- /.box-header -->
                        <!-- form start -->
                            <div class="box-body">
                                <div class="form-group">
                                    <div class="input-group margin col-xs-6">
                                        <div class="input-group-btn">
                                            <button class="btn btn-danger" type="button">课程选择：</button>
                                        </div><!-- /btn-group -->
                                        <select name="course_id" class="form-control">
                                        	<volist name="Course" id="val">
                                        	<option <if condition="$info['course_id'] eq $val['course_id']">selected="selected"</if> value="<{$val['course_id']}>"><{$val['course_name']}></option>
                                        	</volist>
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <div class="input-group margin col-xs-6">
                                        <div class="input-group-btn">
                                            <button class="btn btn-danger" type="button">文件上传：</button>
                                        </div><!-- /btn-group -->
                                        <input type="file" id="file" name="file" value="上传" class="form-control"/>
                                    </div>
                                </div>
								<div class="form-group" id="load" style="display:none;">
                                    <div class="input-group margin col-xs-6">
                                        <img style="display:block;margin:0 auto;" src="/Public/images/loading.gif" >
                                    </div>
                                </div>
								
								
                            </div><!-- /.box-body -->
                            <div class="box-footer">
                                <input type="hidden" name="step" id="step" value="2" />
                                <button class="btn btn-primary" id="submit1" type="button">提交</button>
                                <a href="javascript:history.go(-1)" class="btn btn-primary">返回</a>
								<a href="/import/course.zip" target="_blank" class="btn btn-primary">模板</a>
								
                            </div>
                    </div>
                </form>
                <!-- /.box -->
            </div>
            <!--/.col (left) -->
        </div>
        <!-- 右侧 -->
        <!-- /.content -->
    </aside>
    <!-- /.right-side -->
</div>
<!-- ./wrapper -->

<script>
var run=0;
var id=0;
var clock;
$('#submit1').click(function(){
	if(run){
		alert('当前有任务在运行，请耐心等待');
		return;
	}
	var form = new FormData(document.getElementById("myForm"));
	$.ajax({
		type :"post",
		url : "/admin/course/import?step=2",
		data : form,
		dataType: 'json',
		processData:false,
		//告诉jQuery不要去设置Content-Type请求头,因为表单已经设置了multipart/form-data
		contentType:false,
		success :function (res) {
			if(res.code){
				alert(res.msg);
				return;
			}else{
				run=1;
				id=res.data.id;
				$('#load').show();
				clock = setInterval(task, 1000);
			}
		}
	})

});
function task(){
	$.ajax({
		url:"/admin/course/task", //请求的url地址
		dataType:"json", //返回格式为json
		async:false,//请求是否异步，默认为异步，这也是ajax重要特性
		data:{"id":id}, //参数值
		type:"GET", //请求方式
		
		success:function(res){
			if(res.data.status==0){
				return;
			}
			run=0;
			id=0;
			clearInterval(clock);
			$('#load').hide();
			alert(res.data.note);
		},
		
	});
}
</script>
</body>
</html>