MVC批量上传文件

   初始图片:

 

 选中图片后

 

  ----------------------------------------------------------------------------------

  前端代码
  

<script src="~/Scripts/jquery-1.8.2.min.js"></script>
    @using (Html.BeginForm("SaveFile", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
    {
        <div class="pageFormContent"  >
            <script type="text/javascript">
                var num = 0;
                function FileSelect(n) {
                    if ($("div[id*='div']").length > 0)
                    {
                        num = parseInt($("div[id*='div']").last().attr("id").replace("div", "")) + 1;
                    }
                    else {
                        num = 0;
                        num++;
                        
                    }
                   // alert("num:"+num + " n:"+n);
                    if (num - 1 <= n)
                    {
                        $("#DIV_Files").append('<div id="div' + num + '" > <input name="files" type="file"  multiple="multiple" onclick="FileSelect(' + num + ')"  />  <input type="button" name="delInput"  value="移除"   onclick="DelFile(div' + num + ')" /></div>');
                    }
                }
                function DelFile(sss) {
                    $(sss).remove();
                }

                function onload() {
                 //   FileSelect(0);
                }
            </script>
            <div id="DIV_Files" style=" height:300px; width:450px;  padding-left:10px;  background-color:gray; overflow:scroll">
                <div>
                    <input id="file" name="files" type="file" multiple="multiple" onclick="FileSelect(0)"/>
                </div>
            </div>
            <input id="submit" type="submit" value="批量上传" />
         @ViewBag.Msg
     </div> }

     multiple="multiple":表示可以多选,js中代码实现点击最后一个上传input会立即生成一个input,并可以移除.样式什么的,自己定义 

 ----------------------------------------------------------------------------------

 

HomeController 中代码

public ActionResult Index(string message)
        {
            ViewBag.Msg = message;
            return View();
        }

        [HttpPost]
        public ActionResult SaveFile(IEnumerable<HttpPostedFileBase> files)
        {
            string msg = string.Empty;
            foreach (HttpPostedFileBase file in files)
            {
                if (file != null && file.ContentLength > 0)
                {
                    file.SaveAs(Server.MapPath("~/") + Path.GetFileName(file.FileName));
                    //msg = "Suc";
                }
                else
                {
                   // msg = "Fail";
                }
            }
          

            return RedirectToAction("Index","Home",new {message=msg});
        }

  

posted @ 2015-04-01 16:53  sy2015  阅读(356)  评论(0)    收藏  举报