MVC下form表单一次上传多种类型的图片(每种类型的图片可以上传多张)

form表单一次上传多种类型的图片(每种类型的图片可以上传多张)

controller中的action方法

public ActionResult UploadImage( )
{

     int imageType=(int)Request.Form["ImageType"];

     //整体图片集合
            IList<HttpPostedFileBase> wholePictureIList = Request.Files.GetMultiple("WholePicture");//HttpPostedFileBase:充当类的基类,这些类提供对客户端上传的文件的单独访问;Request.Files.GetMultiple(string name):返回与name匹配的所有文件

     //周边图片集合
            IList<HttpPostedFileBase> AroundSupportPictureIList = Request.Files.GetMultiple("AroundSupportPicture");


            if (wholePictureIList[0].FileName != "")
            {
                foreach (var item in wholePictureIList)
                {
                    byte[] b = new byte[item.ContentLength];
                    item.InputStream.Read(b, 0, item.ContentLength);
                    model.WholePicture.Add(b);//model.WholePicture是byte[]的集合,即图片的流文件,可以存到数据库中
                }
            }
            if (AroundSupportPictureIList[0].FileName != "")
            {
                foreach (var item in AroundSupportPictureIList)
                {
                    byte[] b = new byte[item.ContentLength];
                    item.InputStream.Read(b, 0, item.ContentLength);
                    model.AroundSupportPicture.Add(b);
                }
            }
            int userId = (int)Session["UserId"];
            ManageParkPediaService service = new ManageParkPediaService();
           StateInfo<int> infoT = service.SaveImage(model, userId);
           return Json(infoT);
}

 

view中的代码

引入<script src="~/Scripts/jquery.form.js"></script>

<script type="text/javascript">
        //上传图片
        function uploadImage() {
            $('#fileForm').ajaxSubmit({
                success: function (msg) {
                    console.log(msg);
                }
            });
        }
</script>

<form id="fileForm" method="post" action="http://localhost:38594/UploadImage/SaveImageResult" enctype="multipart/form-data">
  <input type="text" name="ImageType" id="ImageType" value="1" />
   <input type="file" name="WholePicture" id="WholePicture" readonly multiple />
  <input type="file" name="AroundSupportPicture" id="AroundSupportPicture" readonly multiple />
   <input type="button" onclick="uploadImage()" value="上传图片" />
</form>

 

posted on 2017-01-19 10:04  lijingran  阅读(3400)  评论(3编辑  收藏  举报

导航