文件上传，"这次交卷，坚决不改了"

时间：2016-04-29 14:04:49 阅读：200 评论：0 收藏：0 [点我收藏+]

标签：

1.EasyUI绑定一个文件列表和列表的菜单

<table id="bugImages_dg" data-options="fit:true">
</table>
<div id="bugImages_toolbar" class="datagrid-toolbar">
    <table cellspacing="0" cellpadding="0">
        <tbody>
            <tr>
                <td>
                    <a href="javascript:void(0);" class="l-btn l-btn-plain" onclick="bugImages_add()">
                        <span class="l-btn-left"><span class="l-btn-text icon-add l-btn-icon-left">上传</span></span>
                    </a>
                </td>
                <td>
                    <a href="javascript:void(0);" class="l-btn l-btn-plain" onclick="bugImages_download()">
                        <span class="l-btn-left"><span class="l-btn-text icon-application_edit l-btn-icon-left">下载</span></span>
                    </a>
                </td>
            </tr>
        </tbody>
    </table>
</div>

2.文件列表的绑定方法

function bugImageBind() {
    var bugId = $("#hiddenBugId").val();

    $("#bugImages_dg").datagrid({
        url: "/BugImages/bugImagesJson.ashx" ,
        queryParams: { uptype: 0, bugId: bugId },
        striped: true, rownumbers: false, pagination: false, pageSize: 30, singleSelect: true,
        idField: ‘Id‘,
        sortName: ‘Id‘,
        sortOrder: ‘desc‘,
        pageList: [20, 30, 40, 60, 80, 100],
        columns: [[
            { field: ‘imageId‘, title: ‘文件Id‘, hidden: true },
            { field: ‘bugId‘, title: ‘缺陷Id‘, hidden: true },
            { field: ‘text‘, title: ‘文件名称‘, width:250 },
            { field: ‘creatorId‘, title: ‘上传人Id‘, hidden: true },
            { field: ‘createDate‘, title: ‘上传时间‘, width: 150 }
        ]],
        toolbar: ‘#bugImages_toolbar‘
    });

    $("#bugImages_dg").datagrid(‘clearSelections‘).datagrid(‘clearChecked‘);
}

3.Ajax上传所用的iframe表单

技术分享

<div style="display: none;">
    <form id="formUpload" name="formToUpload" method="post" action="" enctype="multipart/form-data" target="msgframe">
        <input id="fileToUpload" type="file" size="45" name="fileToUpload" />
    </form>
</div>
<iframe id="msgframe" name="msgframe" style="display: none;"></iframe>
<iframe id="downloadFrame" name="downloadFrame" style="display: none;" src=""></iframe>

View Code

4.选中文件的触发和上传方法

//缺陷附件上传
function bugImages_add() {
    $("#fileToUpload").click();
            
    var bugId = $("#hiddenBugId").val();
    var user = $("#hiddenUser").val();

    $("#formUpload").attr("action", "/BugImages/bugImagesJson.ashx?uptype=1&bugId=" + bugId + "&creatorId=" + user);

    timeout = setTimeout("checkFile()", 1000);
}

var timeout;
function checkFile() {
    var fileInput = $("#fileToUpload");
    if (fileInput.val() == "" || fileInput.val() == null) {
        timeout = setTimeout("checkFile()", 1000);
    } else {
        if (fileInput.get(0).files) {
            var fileSize = fileInput.get(0).files[0].size;
            if (fileSize > 2 * 1024 * 1024) {
                alert(‘上传文件不能超过2M‘);
            } else {
                clearTimeout(timeout);
                $("#formUpload").submit();
                $("#fileToUpload").val("");
            }
        } else {
            alert(‘附件上传不支持IE10以下版本浏览器‘);
            clearTimeout(timeout);
            $("#fileToUpload").val("");
        }
    }
}

5.上传服务器端处理

string s = string.Empty;
string msg = "window.parent.bugImageBind();";
string strReturn =
@"
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script type=‘text/javascript‘>
        @msg
    </script>
</head>
<body>
</body>
</html>
";
try
{
    var file = context.Request.Files["fileToUpload"];
    //保存
    if (file != null && file.ContentLength > 0 && file.ContentLength <= 2 * 1024 * 1024)
    {
        string[] ieBugStrings = file.FileName.Replace("\\", "&").Split(‘&‘);
        string fileName = ieBugStrings[ieBugStrings.Length - 1];

        string path = context.Server.MapPath("~") + "Upfiles\\" + fileName;
        if (File.Exists(path))
            File.Delete(path);

        file.SaveAs(path);

        FileStream fileStream = new FileStream(path, FileMode.Open, FileAccess.Read);
        Byte[] byteData = new Byte[fileStream.Length];
        fileStream.Read(byteData, 0, byteData.Length);
        fileStream.Close();

        bugImagesDataModel bug = new bugImagesDataModel();
        bug.bugId = context.Request["bugId"];
        bug.imageData = byteData;
        bug.text = fileName;
        bug.creatorId = context.Request["creatorId"];
        bug.createDate = DateTime.Now;

        using (BugImagesServiceClient svc = new BugImagesServiceClient())
        {
            svc.AddbugImages(bug, ref s);
        }

        if (File.Exists(path))
            File.Delete(path);
    }
    else
    {
        msg = "alert(‘附件不能超过2M‘);";
    }
}
catch (Exception ex)
{
    msg = "alert(‘" + ex + "‘);";
}

context.Response.ContentType = "text/html";
context.Response.Write(strReturn.Replace("@msg", msg));

6.下载事件

function bugImages_download() {
    var bugImage = $("#bugImages_dg").datagrid(‘getSelected‘);
    if (bugImage) {
        $("#downloadFrame").attr("src", "/BugImages/bugImagesJson.ashx?uptype=2&imageId=" + bugImage.imageId);
    } else {
        alert("请先选择要下载的附件");
    }
}

7.下载服务器端处理

string imageId = context.Request["imageId"];
string s = string.Empty;
bugImagesDataModel[] models;
using (BugImagesServiceClient svc = new BugImagesServiceClient())
{
    string searchString = "where imageId=‘" + imageId + "‘";
    string orderString = "order by createDate desc";
    models = svc.GetbugImagesDataList(searchString, orderString, 0, 10000, ref s);
}
if (models.Length > 0)
{
    byte[] byteImg = models[0].imageData;
    context.Response.Buffer = false;
    context.Response.ContentType = "image/jpg";
    context.Response.AddHeader("Content-Disposition", "attachment;filename=" + models[0].text);
    context.Response.BinaryWrite(byteImg);//写入二进制流
    context.Response.End();
}

文件上传，"这次交卷，坚决不改了"

标签：

原文地址：http://www.cnblogs.com/zhongxinWang/p/5445710.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行