easyui ajax 彈出蒙版載入中...
js頁：
/**
* 第一步：解析預覽按鈕事件
*/
function importFile(){
var shopName=$("#shopName").val();
var fileSource=$("#fileSource").val();
var fileExportDate=$("#fileExportDate").val();
var json={"shopName":shopName,"fileSource":fileSource,"fileExportDate":fileExportDate};
var options = {
url:ctx+'/turnover/parseExcelData',
type:'post',
async:true,
beforeSend: function () {
ShowDiv();
},
complete: function () {
HiddenDiv();
success:function(data){
if(data.result=="1"){//--1--則是詳情
window.location.href=ctx+'/turnover/list';
}else{
}
}
};
$("#importOrderFrom").ajaxSubmit(options);
}
//顯示載入資料
function ShowDiv() {
$.messager.progress({
title: '提示',
//msg: '匯入中...',
text: '匯入中...'
});
}
//隱藏載入資料
function HiddenDiv() {
$.messager.progress('close');
}
jsp頁面：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.min.css">
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap-select.min.css">
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap-table.min.css">
<link rel="stylesheet" href="${pageContext.request.contextPath}/font-awesome/css/font-awesome.css">
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/common/fron_style.css">
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/turnover/warehouse_record.css?v=201802261604">
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/easyui/themes/default/easyui.css?v=201802261604">
<script type="text/javascript">
var ctx='${pageContext.request.contextPath}';
</script>
</head>
<body style="padding-top:0;">
<form id="importOrderFrom" name="importOrderFrom" method="post" enctype="multipart/form-data">
<div class="searchcont" style="width:100%;background:#FCFCFC;padding:20px 2%;border-bottom:1px solid #eee;">
<div class="row">
<div class="col-md-12 col-sm-12">
<span style="width:7em;">店鋪名稱<i>*</i></span>
<input id="shopName" type="text" class="sm sm-ord" placeholder="請輸入店鋪名稱" style="width:300px;">
</div>
</div>
<div class="row">
<div class="col-md-12 col-sm-12">
<span style="width:7em;">檔案來源<i>*</i></span>
<select id="fileSource" class="sm sm-ord" style="width:300px;">
<option value="10003">京東自營</option>
</select>
</div>
</div>
<div class="row">
<div class="col-md-12 col-sm-12">
<span style="width:7em;">匯出日期<i>*</i></span>
<input id="fileExportDate" type="text" onclick="WdatePicker({dateFmt:'yyyy-MM-dd',skin:'whyGreen'});" class="sm sm-ord" style="width:300px;"/>
</div>
</div>
<!-- <div class="row">
<div class="col-md-12 col-sm-12">
<span style="width:7em;">近1天銷量<i>*</i></span>
<button class="sm sm-spe shangchuanbtn">選擇檔案</button>
<input type="file" id="file1" name="importFile1" style="display: inline-block;">
<s></s>
</div>
</div> -->
<div class="row">
<div class="col-md-12 col-sm-12">
<span style="width:7em;">近7天銷量<i>*</i></span>
<!-- <button class="sm sm-spe shangchuanbtn">選擇檔案</button> -->
<input type="file" id="file2" name="importFile2" style="display: inline-block;">
<s></s>
</div>
</div>
<!-- <div class="row">
<div class="col-md-12 col-sm-12">
<span style="width:7em;">近30天銷量<i>*</i></span>
<button class="sm sm-spe shangchuanbtn">選擇檔案</button>
<input type="file" id="file3" name="importFile3" style="display: inline-block;">
<s></s>
</div>
</div> -->
<div class="row">
<div class="col-md-12 col-sm-12">
<span style="width:7em;">在途商品<i>*</i></span>
<label>
<input type="checkbox" checked>
系統自動獲取
</label>
<s class="green"><i class="fa fa-check"></i>更新成功</s>
<s class="red"><i class="fa fa-times"></i>更新失敗</s>
</div>
</div>
</div>
<div class="btnall">
<button class="sm sm-ord" type="button" onclick="importFile()" >確認匯入</button>
<a href="${pageContext.request.contextPath}/turnover/list.do"><button class="sm sm-spe" type="button">返回</button></a>
</div>
</form>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/bootstrap-table.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/bootstrap-select.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-form.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/dateutil.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/common/fron_style.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/turnover/warehouse_record.js?version=201802261604"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/turnover/turnover_importFile.js?version=201803011753"></script>
</body>
</html>