easyui上传文件

效果图:

代码:

<form id="importFileForm" method="post" enctype="multipart/form-data" style="display:">
            <table style="margin:5px;height:70px;">
                <tr>
                    <td></td>
                    <td width="5px;"></td>
                    <td><input class="easyui-filebox" id="fileImport" data-options="buttonText:'选择',prompt:'请选择文件...'"  name="fileImport" style="260px;">
                    </td>
                    <td><a id="uploadFile" class="easyui-linkbutton" data-options="iconCls:'icon-ok'" href="javascript:void(0)">上传</a></td>
                </tr>
                <tr>
                    <td colspan="4">
                        <label id="uploadInfo" />
                    </td>
                </tr>
            </table>
        </form>
    <script>
        //导入文件
        $("#uploadFile").click(function () {
            var formData = new FormData($("#importFileForm")[0]);
            //调用apicontroller后台action方法,将form数据传递给后台处理。contentType必须设置为false,否则chrome和firefox不兼容
            $.ajax({
                url: "http://localhost:12745/api/easyuiUpload/PostExcelData",
                type: 'POST',
                data: formData,
                async: false,
                cache: false,
                contentType: false,
                processData: false,
                success: function (returnInfo) {
                    //上传成功后将控件内容清空,并显示上传成功信息
                    document.getElementById('fileImport').value = null;
                    document.getElementById('uploadInfo').innerHTML = "<span style='color:Red'>" + returnInfo + "</span>";
                },
                error: function (returnInfo) {
                    //上传失败时显示上传失败信息
                    document.getElementById('uploadInfo').innerHTML = "<span style='color:Red'>" + returnInfo + "</span>";
                }
            });
           
        })
    </script>

后台:
public class easyuiUploadController : ApiController
    {
        /// <summary>
        /// 将文件上传到指定路径中保存
        /// </summary>
        /// <returns>上传文件结果信息</returns>
        [System.Web.Http.HttpPost]
        
        public string PostExcelData()
        {
            string info = string.Empty;
            try
            {
                //获取客户端上传的文件集合
                HttpFileCollection files = System.Web.HttpContext.Current.Request.Files;
                //判断是否存在文件
                if (files.Count > 0)
                {
                    //获取文件集合中的第一个文件(每次只上传一个文件)
                    HttpPostedFile file = files[0];
                    //定义文件存放的目标路径
                    string targetDir = System.Web.HttpContext.Current.Server.MapPath("~/FileUpLoad/Product");
                    //创建目标路径
                    if (!Directory.Exists(targetDir))
                    {
                        Directory.CreateDirectory(targetDir);
                    }
                    //ZFiles.CreateDirectory(targetDir);
                    //组合成文件的完整路径
                    string path = System.IO.Path.Combine(targetDir, System.IO.Path.GetFileName(file.FileName));
                    //保存上传的文件到指定路径中
                    file.SaveAs(path);
                    info = "上传成功";
                }
                else
                {
                    info = "上传失败";
                }
            }
            catch
            {
                info = "上传失败";
            }
            return info;
        }
    }

  

原文地址:https://www.cnblogs.com/liuqiyun/p/7144628.html