asp.netMVC+easyUI文件上传

OStack程序员社区-中国程序员成长平台 › 门户 › 编程› ASP.NET›ASP.NET编程经验

原作者: [db:作者] 来自: [db:来源] 收藏邀请

前言：公司前端都是index页面引用js，剩下的添加。。。都是html页。加大操作难度5555，所以就是主页面操作子页面上传。效果如下：

1，前端html页代码如下。其中请注意，form中enctype="multipart/form-data"，必须使用form-data传值。并且html5可直接在input标签file控件中设置accept属性限制上传文件类型，设置multiple属性可同时上传多个文件。如果是页面为cshtml,则可以直接设置上传按钮的data-bind="click:事件名称"进行事件的绑定，因为页面为html页，我在js中处理绑定

<form >
            <table class="dialog-table">
                <tbody>
                    <tr>
                        <td class="col-name">上传照片：</td>
                    <td>
                        <input type="file" class="easyui-filebox" >
                        <a >上传</a>
                    </td>
                        
                </tbody>
            </table>
        </form>

2，下面是js代码，其中box为子窗体对象，若为cshtml即可直接用$获取对象，其中获取file对象为var file = document.getElementById('fileImport').files[0];form数据即为new FormData($("#importFileForm")[0]);

 1 function initAdd($box) {  
 2     $box.find("#uploadFile").bind('click', function (e) {
 3         // file对象
 4         var file = $box.find("#fileImport")[0].files[0];
 5         //判断控件中是否存在文件内容，如果不存在，弹出提示信息，阻止进一步操作
 6         if (file == null) { alert('错误，请选择文件'); return; }
 7       
 8         //获取文件名称
 9         var fileName = file.name;
10         //获取文件类型名称
11         var file_typename = fileName.substring(fileName.lastIndexOf('.'), fileName.length);
12     
13         var p = $box.find("#importFileForm");
14         //获取form数据
15         var formData = new FormData(p[0]);
16      
17         $.ajax({
18             url: "/YGXX/YGGL/PostExcelData",
19             type: 'POST',
20             data: formData,
21             async: false,
22             cache: false,
23             contentType: false,
24             processData: false,
25             success: function (returnInfo) {
26                 alert(1);
27             },
28             error: function (returnInfo) {
29                 alert(0);
30             }
31         });
32     });
33     }

3，Controller代码

 1 [HttpPost]
 2         public string PostExcelData()
 3         {
 4             //获取客户端上传的文件集合
 5             HttpFileCollection files = System.Web.HttpContext.Current.Request.Files;
 6             //获取文件集合中的第一个文件(每次只上传一个文件)
 7             HttpPostedFile file = files[0];
 8             //定义文件存放的目标路径
 9             string targetDir = System.Web.HttpContext.Current.Server.MapPath("~/Content/touxiang");
10             
11             //组合成文件的完整路径
12             string path = System.IO.Path.Combine(targetDir, System.IO.Path.GetFileName(file.FileName));
13             //保存上传的文件到指定路径中
14             file.SaveAs(path);
15             return path;
16         }