ajax jquery 上传文件
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/commons/includes.jsp"%>
<html>
<head>
<title>${systemName }</title>
<style type="text/css">
.header {
height: 60px;
text-align: center;
background-image: url("${contextPath}/images/headbg3.gif");
background-repeat: repeat-x;
}
.headerright {
float: right;
height: 100%;
width: 400px;
}
.headerright .headerrighttext {
margin-top: 20px;
}
.headerright .headerrighttext a,.headerright .headerrighttext a:link {
text-decoration: none;
}
.headerright .headerrighttext .tip {
float: left;
height: 15px;
width: 200px;
}
.headerright .headerrighttext .updatepwd {
color:blue;
height: 15px;
float: left;
width: 80px;
cursor: pointer;
}
.headerright .headerrighttext .logout {
float: left;
height: 15px;
width: 80px;
}
.title {
float: left;
margin: 16px 0 0 100px;
font-weight:bold;
font-size: 28px;
}
.memu {
width: 200px;
}
.iframe {
border: 0 none;
}
.footer {
height: 20px;
text-align: center;
background-color: #E6EEF8;
}
.icon-excel {
background: url('${contextPath}/images/excel-small.png') no-repeat
center center;
}
#pwdForm {
margin: 0;
padding-left: 80px;
padding-top: 20px;
}
.ftitle {
font-size: 14px;
font-weight: bold;
padding: 5px 0;
margin-bottom: 10px;
border-bottom: 1px solid #ccc;
}
.fitem {
margin-bottom: 20px;
padding-top: 10px;
}
.fitem label {
display: inline-block;
width: 90px;
}
</style>
<script>
var isCreate=false;
var createDateStr;
$.extend($.fn.validatebox.defaults.rules, {
equals: {
validator: function(value,param){
return value == $(param[0]).val();
},
message: '两次输入的密码不一致!'
}
});
function uploadExcel(){
$('#uploadExcel').dialog('open').dialog('setTitle','上传文件');
$('#uploadExcelForm').form('clear');
}
function uploadExcelForm(){
var option = {
type: "post",
success : function(data){
createData();
}
};
$("#uploadExcelForm").ajaxSubmit(option);
}
function update() {
jQuery("#dlg").dialog('open').dialog('setTitle', '修改密码');
}
function updatePassword() {
if(jQuery('#pwdForm').form('validate')==true){
jQuery("#pwdForm").submit();
}
}
function createData(){
var year=jQuery("[name='year']").val();
var month=jQuery("[name='month']").val();
jsTool.ajax({
url:"${contextPath}/tabledata/createData.do",
data:{year:year,month:month},
success:function(data){
showTableTree(data.flag);
$('#save-dlg').dialog('close');
},
error:function(){
jQuery.messager.alert('数据生成失败','请检查U8数据库后重试','warning');
}
});
}
function showData(url){
url+="?year="+jQuery("[name='year']").val()+"&month="+jQuery("[name='month']").val()+"&isCreate="+isCreate+"&createDateStr="+createDateStr;
jQuery("[name='mainFrame']").attr("src",url);
}
function showTableTree(){
var year=jQuery("[name='year']").val();
var month=jQuery("[name='month']").val();
var url="${contextPath}/show/show001Cover.do";
jsTool.ajax({
url:"${contextPath}/tabledata/isCreate.do",
data:{year:year,month:month},
success:function(data){
isCreate=data.flag;
createDateStr=data.createDateStr;
var node=jQuery('#showTableData').tree("find","show001Cover");
jQuery("#showTableData").tree("select",node.target);
showData(url);
if (isCreate) {
jQuery("#showTableData").show();
}else {
jQuery("#showTableData").hide();
}
},
error:function(){
jQuery.messager.alert('数据连接失败','请检查数据库网络后重试','warning');
}
});
}
jQuery(function(){
jsTool.form({
form : jQuery("#pwdForm"),
datatype:'String',
success : function(data) {
jQuery("#dlg").dialog('close');
}
});
jQuery("#RightAccordion").accordion({ //初始化accordion
fillSpace:true,
fit:true,
border:false,
animate:false
});
$.post("${contextPath}/list.do", { "id": "0" }, //获取第一层目录
function (data) {
if (data == "0") {
window.location = "/Account";
}
$.each(data, function (i, e) {//循环创建手风琴的项
var id = e.id;
$('#RightAccordion').accordion('add', {
title: e.text,
content: "<ul id='tree"+id+"' ></ul>",
selected: true,
iconCls:e.iconCls//e.Icon
});
$("#tree" + id).tree({
data: e.children
});
$.parser.parse();
});
},"json");
jQuery('#showTableData').tree({
data: [{
text: '查看报表',
children: [{
id:'show001Cover',
text: '封面',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/show/show001Cover.do"
}
},{
text: '资产负债表',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/show/showZcfzb1.do"
}
},{
text: '资产各月比较表',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/show/showZcfzb2.do"
}
},{
text: '负债和所有者权益各月比较表',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/show/showZcfzb3.do"
}
},{
text: '应收账款分析表－按账龄',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/excels2/sheet005.html"
}
},{
text: '应收账款分析表－按风险',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/excels2/sheet006.html"
}
},{
text: '存在风险应收账款变动表',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/excels2/sheet007.html"
}
},{
text: '存货分析表－按类别',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/show/showChfxblb.do"
}
},{
text: '存货分析表－按风险',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/excels2/sheet009.html"
}
},{
text: '存在风险存货变动表',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/excels2/sheet010.html"
}
},{
text: '利润表',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/show/showLrb1.do"
}
},{
text: '利润表各月比较表',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/show/showLrb1ByMonth.do"
}
},{
text: '营业收入分析表－按地区划分',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/excels2/sheet013.html"
}
},{
text: '营业收入分析表－按品种划分',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/show/show014YysrPz.do"
}
},{
text: '营业成本分析表－按品种划分',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/show/show015YycbPz.do"
}
},{
text: '毛利分析表',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/excels2/sheet016.html"
}
},{
text: '毛利率分析表',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/excels2/sheet017.html"
}
},{
text: '各月销售费用比较表',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/excels2/sheet018.html"
}
},{
text: '各月管理费用比较表',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/excels2/sheet019.html"
}
},{
text: '各月财务费用比较表',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/excels2/sheet020.html"
}
},{
text: '现金流量表各月比较表',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/show/showXjllb1.do"
}
},{
text: '经营成果分析表（月度）',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/show/showJycgfxb1.do"
}
},{
text: '利润分析表',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/show/showLrb1Fxb.do"
}
},{
text: '经营成果分析表（累计）',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/excels2/sheet024.html"
}
},{
text: '可比公司指标平均值',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/excels2/sheet025.html"
}
},{
text: '经营成果分析表（年度）',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/show/showJycgfxb2.do"
}
},{
text: '毛利率计算',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/excels2/sheet027.html"
}
},{
text: '显示测试',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/show/show.do"
}
},{
text:'显示测试_存货分析表',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/show/showChfxblb.do"
}
}]
}],
onClick:function(node){
if(node.attributes){
var url=node.attributes.url;
showData(url);
}
}
});
jQuery('#Title2').tree({
data: [{
text: '用户管理',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/user/userOperation.do"
}
},{
text: '角色管理',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/roleOperation.do"
}
}],
onClick:function(node){
if(node.attributes){
var url=node.attributes.url;
jQuery("[name='mainFrame']").attr("src",url);
}
}
});
jQuery('#Title3').tree({
data: [{
text: '报表导出',
iconCls:'icon-excel',
attributes:{
url:"${contextPath}/report/report.do"
}
}],
onClick:function(node){
if(node.attributes){
var url=node.attributes.url;
jQuery("[name='mainFrame']").attr("src",url);
}
}
});
showTableTree();
});
</script>
</head>
<body>
<div class="easyui-layout" data-options="fit:true" style="width:100%;height:100%;">
<div class="header" data-options="region:'north'" style="border-bottom:0 none;" >
<div class="title">${systemName }</div>
<div class="headerright">
<div class="headerrighttext">
<div class="tip">用户名：${sessionScope.curruser.realName}（${sessionScope.curruser.username}）</div>
<div class="updatepwd" onclick="update()">修改密码</div>
<div class="logout"><a href="${contextPath}/logout.do">退出</a></div>
</div>
</div>
</div>
<div class="footer" data-options="region:'south'" style="border-top:0 none;">
©版权所有
</div>
<div class="memu" data-options="region:'west',split:true,minWidth:'30',maxWidth:'400'" id="menu">
<div id="RightAccordion" class="easyui-accordion" data-options="fit:true,border:false">
<div title="查看表格" data-options="selected:true">
<div style="text-align: center;">
<select id="nian" class="easyui-combobox" name="year" style="width:80px;" data-options="onSelect: function(rec){
showTableTree();
}">
<option value="${year-5}">${year-5}</option>
<option value="${year-4}">${year-4}</option>
<option value="${year-3}">${year-3}</option>
<option value="${year-2}">${year-2}</option>
<option value="${year-1}">${year-1}</option>
<option value="${year}" selected>${year}</option>
<option value="${year+1}">${year+1}</option>
<option value="${year+2}">${year+2}</option>
<option value="${year+3}">${year+3}</option>
<option value="${year+4}">${year+4}</option>
<option value="${year+5}">${year+5}</option>
</select>
年
<select id="yue" class="easyui-combobox" name="month" style="width:50px;" data-options="onSelect: function(rec){
showTableTree();
}">
<c:forEach begin="1" end="12" var="i">
<c:if test="${i==month}">
<option value="${i }" selected="selected">${i }</option>
</c:if>
<c:if test="${i!=month}">
<option value="${i }">${i }</option>
</c:if>
</c:forEach>
</select>
月
<a href="javascript:void(0)" id="gen" class="easyui-linkbutton" iconCls="icon-add" onclick="uploadExcel();">生成报告</a>
</div>
<div id="showTableData"></div>
</div>
<div title="导入导出" data-options="" id="Title3"></div>
<div title="用户管理" data-options="" id="Title2"></div>
</div>
</div>
<div data-options="region:'center'" style="overflow-y:hidden;border-top:0 none;" >
<iframe name="mainFrame" src="${contextPath}/show/show001Cover.do" frameborder="0" width="100%" height="100%"></iframe>
</div>
</div>
<div id="dlg" class="easyui-dialog" style="width:500px;height:350px;padding:10px 20px"closed="true" buttons="#dlg-buttons">
<div class="ftitle">修改密码</div>
<form id="pwdForm" method="post" action="${contextPath}/updatePassword.do" novalidate>
<div class="fitem">
<input name="id" class="easyui-validatebox" value="${sessionScope.curruser.id}" type="hidden">
</div>
<div class="fitem">
<label>请输入新密码:</label>
<input id="password"name="password" type="password" class="easyui-validatebox" data-options="required:true,validType:['length[6,20]']">
</div>
<div class="fitem">
<label>请重新输入密码:</label>
<input id="repassword"name="repassword" type="password" class="easyui-validatebox" required="required" validType="equals['#password']">
</div>
</form>
</div>
<div id="uploadExcel" class="easyui-dialog" style="width:500px;height:350px;padding:10px 20px"
closed="true" buttons="#dlg-save-buttons">
<div class="ftitle">上传文件</div>
<form id="uploadExcelForm" method="post" action="${contextPath}/excel/import.do" enctype="multipart/form-data">
<input type="file" name="file" />
<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-ok" onclick="uploadExcelForm()">上传并生成</a>
</form>
</div>
<div id="dlg-buttons">
<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-ok" onclick="updatePassword()">保存</a>
<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')">取消</a>
</div>
</body>
</html>
版权声明：本文为博主原创文章，未经博主允许不得转载。