一、前端写EasyUI窗口
<div id="upload_win" class="easyui-window" title="文件上传窗口" style="width: 430px; height: 180px; padding: 4px 7px 2px 4px;"
data-options="iconCls:'icon-save',modal:false,closed:true,closable:true,minimizable:false,maximizable:false,collapsible:false,resizable:true">
</div>
二、前端清空后台其他页面产生的Session并设置当关闭easyUI窗口时的js处理代码，然后弹出上传窗口
function upload() {
var selected = $('#myTree').tree('getSelected');
$.messager.confirm("信息提示", "您确实要上传文件到" + selected.text + "这个文件夹吗？", function (r) {
if (r) {
//清空FileManage_uploadFile文件中产生的Session
$.ajax({
type: "post",
url: "/UI/FileManage_page/FileManage.aspx/ClearSession",
dataType: "text", //你可以用JSON
contentType: "application/json; charset=utf-8",
async: false,
success: function (data) {
},
error: function () {
alert('调用后台方法出错！');
}
});
var zplj = get_all_parent_node(selected);
var ss = '/UI/FileManage_page/FileManage_UploadFile.aspx?zplj=' + zplj;
$('#upload_win').window({
title: '文件上传窗口',
draggable: true,
width: 539,
height: 180,
cache: false,
resizable: false,
content: "<iframe scrolling='auto' frameborder='0' src='" + ss + "' style='width:100%; height:100%; display:block;'></iframe>",
modal: true
});
$("#upload_win").window({
onClose: function () {
$.ajax({
type: "post",
url: "/UI/FileManage_page/FileManage.aspx/getSession",
dataType: "text",
contentType: "application/json; charset=utf-8",
success: function (data) {
var accept_data = JSON.parse(data);
var sj = JSON.parse(accept_data.d);
var result_str = sj["FileUpload_Result"];
var ext_str = sj["FileUpload_Ext"];
var file_str = sj["FileUpload_FileName"];
var path_str = sj["FileUpload_FilePath"];
var url_str = path_str;
if (result_str == "上传成功") {
//清空FileManage_uploadFile文件中产生的Session
$.ajax({
type: "post",
url: "/UI/FileManage_page/FileManage.aspx/ClearSession",
dataType: "text", //你可以用JSON
contentType: "application/json; charset=utf-8",
async: false,
success: function (data) {
},
error: function () {
alert('调用后台方法出错！');
}
});
var current_fd_name = selected.text;
//获取根节点的子节点
var childData = $("#myTree").tree('getChildren', selected.target);
//求出子节点的最大id
var child_max_id = 0;
for (var i = 0; i < childData.length; i++) {
if (parseInt(childData[i].id) > child_max_id) {
child_max_id = parseInt(childData[i].id);
}
}
if (child_max_id == 0) {
child_max_id = selected.id.toString() + "1";
}
else {
child_max_id = (child_max_id + 1).toString().trim();
}
var id_val = parseInt(child_max_id);
var child_level = parseInt(selected.level) + 1;
$('#myTree').tree('append', {
parent: selected.target,
data: [{
id: id_val,
isfolder: false,
text: file_str,
path: path_str,
ext: ext_str,
url: url_str,
level: child_level,
parentId: selected.id,
state: 'open'
}]
});
var current_user = '<%= Convert.IsDBNull(Session["xx_user"])?"":Session["xx_user"].ToString().Trim()%>';
$.ajax({
type: "post",
url: "/UI/FileManage_page/FileManage.aspx/access_new_file",
dataType: "text",
data: "{id:'" + child_max_id + "',text:'" + file_str + "',path:'" + path_str + "',ext:'" + ext_str + "',url:'" + url_str + "',isfolder:'0',state:'open',level:'" + child_level + "',parentId:'" + selected.id + "',parent_text:'" + selected.text + "',parent_level:'" + selected.level + "',current_user:'" + current_user + "'}",
async: false,
contentType: "application/json; charset=utf-8",
success: function (data) {
var hh = JSON.parse(data);//解析得到json数据
var jj = JSON.parse(hh.d);
if (jj[0].jg) {
$.messager.alert("信息提示", "创建文件成功！");
serverpath.SetText("");
}
else {
$.messager.alert("信息提示", "创建文件失败！");
}
},
error: function () {
$.messager.alert("信息提示", "文件上传功能有错误！");
}
});
}
},
error: function () {
alert('调用后台方法出错！');
}
});
}
});
$('#upload_win').window('open').window('center').window('setTitle', '文件上传窗口');
$('#upload_win').parent().appendTo(jQuery(" form:first "));//这一句最关键，否则不进后台事件，这是easyUI与asp.net服务器控件的一个bug，切记！
}
});
}
三、单独创建aspx上传文件,只写了关键代码
<form id="form1" runat="server" autocomplete="off">
<div style="align-content:center;">
<table style="line-height: 30px; margin: 10px 10px 10px 10px">
<tr>
<td style="width:10%;flex-wrap:nowrap;">
<dx:ASPxLabel ID="select_lbl" runat="server" Text="请选择文件：" Width="80px"></dx:ASPxLabel>
</td>
<td style="width:90%;flex-wrap:nowrap;">
<asp:FileUpload ID="FileUpload1" ClientIDMode="Static" runat="server" Height="23px" />
</td>
</tr>
<tr>
<td>
<dx:ASPxLabel ID="ASPxLabel1" runat="server" Text="服务器路径："></dx:ASPxLabel>
</td>
<td>
<dx:ASPxTextBox ID="serverpath" runat="server" Width="380px" Text=""></dx:ASPxTextBox>
</td>
</tr>
<tr>
<td colspan="2" style="flex-wrap: nowrap;" >
<table style="width:100%;">
<tr>
<td style="flex-wrap: nowrap;width:90%;" >
<dx:ASPxLabel ID="upload_result" runat="server" Text=""></dx:ASPxLabel>
</td>
<td style="flex-wrap: nowrap; text-align:right" >
<dx:ASPxButton ID="upload_btn" runat="server" Text="上传" Style="width: 70px; margin-left: 0px" Theme="Aqua" OnClick="upload_btn_Click" Width="100%" Height="16px">
<ClientSideEvents Click="function(s,e){upload_client_click(s,e);}" />
</dx:ASPxButton>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</form>
四、这是上传文件的上传按钮的js代码：上传前先检测FileUpload控件获取的文件类型是否符合要求，然后决定是否上传，这里有个关键问题就是：在上传文件中的上传按钮上，设置一个前端click事件和一个后端的click事件，这两个事件的执行顺序是先执行前端的后执行后端的，当前端的click事件返回true时，才会执行后端的click事件。否则不执行。
function upload_client_click(s,e)
{
var ext_str = FileUpload1.files[0].name.substr(FileUpload1.files[0].name.lastIndexOf('.') + 1);
var allow_type_array = ['txt','docx','docm','doc','dotx','dotm','dot','mht','mhtml','htm','html','rtf','xml','wtf','wps','xlsx','xlsm','xls','xltx','xltm','xlt','csv','prn','dif','slk','xlam','xla','jpg','bmp','gif','ttif','tif','jpeg','png','swf','svg','pcx'];
if(allow_type_array.indexOf(ext_str)>=0)
{
upload_btn.SetEnabled(true);
return true;
}
else
{
alert("不允许的文件类型！禁止上传！");
upload_btn.SetEnabled(false);
return false;
}
}
秋风写于淄博 业务联系与技术交流：QQ：375172665
扫一扫
246
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
