Easyui上传文件的问题

Posted DevilX5

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Easyui上传文件的问题相关的知识,希望对你有一定的参考价值。

首先,添加以下代码到前端界面

<form id="fm" method="post" enctype="multipart/form-data" style="margin:0;padding:20px 50px">
    <div style="margin-bottom:20px;font-size:14px;border-bottom:1px solid #ccc">上传文件</div>
    <div style="margin-bottom:10px">
        <input id=‘upfile‘ class="easyui-filebox" name="file1" multiple="true" data-options="prompt:‘选择文件‘,buttonText:‘选择文件‘" style="width:300px"/>
        <a id="sub" href="#" class="easyui-linkbutton" iconCls="icon-add" onclick="submit()" plain="true">上传文件</a>
    </div>
</form>

需要注意的地方:easyui-filebox必须要加上name属性,不加后台就没法获取。

千万不要纠结于使用 $(‘#upfile‘).filebox(‘getValue‘) 获取文件路径反馈为 C:\fakepath\... 的问题,这个跟上传文件真的没有一点关系。

写入对应的JS代码

  function submit() {
            $(‘#fm‘).form(‘submit‘, {
                url: ‘/UploadDemo/UploadFiles‘,
                onSubmit: function () {
                    return $(this).form(‘validate‘);
                },
                success: function (result) {
                    var result = eval(‘(‘ + result + ‘)‘);
                    if (result.success) {
                        $.messager.show({   
                            title: ‘提示‘,
                            msg: ‘上传成功‘
                        });
                    } else {
                        $.messager.show({    
                            title: ‘错误‘,
                            msg: result.errorMsg
                        });
                    }
                }
            });
        }

控制器写入上传文件代码

 [HttpPost]
        public ActionResult UploadFiles()
        {
            var success = false;
            var errorMsg = "";

            //获取客户端上传的文件集合
            HttpFileCollection files = System.Web.HttpContext.Current.Request.Files;
            if (files.Count == 0)
            {
                errorMsg = "未获取到任何文件";
                return Json(new { success = success, errorMsg = errorMsg });
            }
            try
            {
                //定义文件存放的目标路径
                string targetDir = System.Web.HttpContext.Current.Server.MapPath("~/Content/Upload/touxiang");
                //获取文件集合中的每一个文件
                for (int i = 0; i < files.Count; i++)
                {
                    HttpPostedFile file = files[i];
                    //组合成文件的完整路径
                    string path = System.IO.Path.Combine(targetDir, System.IO.Path.GetFileName(file.FileName));
                    //保存上传的文件到指定路径中
                    file.SaveAs(path);
                }
                success = true;
            }
            catch (System.Exception ex)
            {
                errorMsg = ex.ToString();
                return Json(new { success = success, errorMsg = errorMsg });
            }
            return Json(new { success = success, errorMsg = errorMsg });
        }

搞定~

以上是关于Easyui上传文件的问题的主要内容,如果未能解决你的问题,请参考以下文章

easyui实现文件上传

如何使用 Jquery EasyUI 将文件上传到 DB mysql?

Easyui的easyui-filebox支持多文件上传吗?

Easyui的easyui-filebox有人知道是不是支持 多文件上传吗?

ajax springMvc 异步 上传 文件

easyUI前端ajax上传文件组件