2014-05-05 171 views
2

这是我第一次在ASP.NET MVC中使用文件上传,并且我已经能够上传图像,调整大小,保存它到服务器,重命名src字符串,以便src图像反映产品名称(例如:“ProductImages/Original/FIFA14.jpg”)。图像src也存储在我使用的Url.Action()在视图中显示图像的数据库中。Asp.Net MVC编辑上传图像(HTTPPostedFileBase)编辑获取

对于我的编辑帖子,我希望用户能够像往常一样更改产品信息。每当用户提交表单时,之前上传的图像将被上传的新图像文件覆盖。

当我输入编辑产品获取视图时,文件输入显示“没有文件被选中”。 我希望它显示用户在他的本地计算机上创建产品之前上传的图像文件。

真的有办法吗,以及如何?

下面是编辑查看我的文件输入:

 <div class="form-group"> 
     @Html.LabelFor(model => model.ProductImageViewModel.ImageUpload, new { @class = "control-label col-md-2" }) 
     <div class="col-md-10"> 
      <input type="file" name="imageUpload" id="imageUpload" /> 
      @Html.ValidationMessageFor(model => model.ProductImageViewModel.ImageUpload) 
     </div> 
    </div> 

为编辑在控制器方法获取:

// GET: /Product/Edit/5 
    public ActionResult Edit(Guid id) 
    { 
     Product product = _productRepository.GetById(id); 


     var productViewModel = new ProductViewModel 
     { 
      Id = product.Id, 
      Name = product.Name, 
      Description1 = product.Description1, 
      Description2 = product.Description2, 
      Description3 = product.Description3, 
      Status = product.Status, 
      Image = product.Image, 
      Weight = product.Weight, 
      Price = product.Price, 
      ReleaseDate = product.ReleaseDate, 
      Category = product.Category, 
      Categories = GetCategoryDropDownListForEdit(product), 
      ProductStatuses = GetStatusDropDownListForEdit(product),     
     }; 



     return View(productViewModel); 
    } 

这是我上传的创建方法中的图像:

// POST: /Product/Create 
    [HttpPost] 
    public ActionResult Create(ProductViewModel model, HttpPostedFileBase imageUpload) 
    { 
     if (UploadedFileIsValidImage(imageUpload)) 
     { 
      byte[] productPicture = new byte[imageUpload.ContentLength]; 
      imageUpload.InputStream.Read(productPicture, 0, imageUpload.ContentLength); 

      WebImage img = new WebImage(imageUpload.InputStream); 
      img.Resize(200, 200); 

      var fileName = imageUpload.FileName; 

      string imageName = model.Name; 
      string extension = Path.GetExtension(fileName); 


      var productImageFileName = imageName + extension; 

      img.FileName = productImageFileName; 
      var filePathOriginal = Server.MapPath("~/ProductImages/Originals"); 
      var filePathThumbNail = Server.MapPath("~/ProductImages/ThumbNails"); 
      string savedImageFileName = Path.Combine(filePathOriginal, productImageFileName); 
      img.Save(savedImageFileName); 
      model.ProductImageViewModel.ImageSrc = savedImageFileName; 
      model.Image = savedImageFileName; 


      try 
      { 
       var guid = new Guid(model.SelectedCategory); 
       _manager.AddProduct(
        model.Name, model.Description1, model.Description2, model.Description3, Convert.ToDecimal(model.Price), 
        Convert.ToDateTime(model.ReleaseDate), 
        Convert.ToDouble(model.Weight), model.ProductImageViewModel.ImageSrc, guid); 
       _categoryRepository.Save(); 
       return RedirectToAction("Index"); 
      } 
      catch 
      { 
       return View(); 
      } 
     } 
     else 
     { 
      model.Categories = CategoryDropDownListForCreate(); 
      return View(model); 
     } 
    } 

那么如何获得输入以在文件输入中显示此产品的当前上传文件?

+0

使用img标签解决它显示它,例如:

+0

也许我的问题不够具体。我希望显示文件输入而不是“不选择文件”,而是创建产品时(从计算机)上次上载的文件的文件名。不是它在数据库中显示图像src的文件名。 – Assassin87

回答

0

当输入的类型是“文件”时,您不能设置它的值。通常您会在编辑视图中添加一个链接以下载当前上传的文件。

1

你不能这样做,因为这是一个安全问题。如果试图通过JavaScript 与下面的代码段

<script type="text/javascript"> 
     document.forms["form1"].elements["uploadImage"].value = "C:\Users\Public\Pictures\Sample Pictures\Chrysanthemum.jpg"; 

</script> 

设置,如果你可以检查你的浏览器控制台,它输出错误信息说

SecurityError: The operation is insecure.

0

尝试这种方式(不解决方案,但需要一种工作方式),

在编辑视图中,并排显示上传图像和图像上传控件的链接。 如果用户想查看/预览上传的图片,可以使用图片链接。 对于新的图像,密切取代旧图像。你可以检查这是控制器Edit的方法。如果HttpPostedFileBase imageUpload不为空,则更新,否则将模型保存到数据库中。

正如已经被其他用户提到,for security reason you cannot assign the path to input control.

0

首先我救了我的DB图像的URL,然后我不得不去解决问题以及与此

// Add this to your controller to check if the file is coming empty, If yes then I copy my previous Url to the new edited object 
else if (file== null) 
     { 
      Product thisProduct = db.Products.Where(p => p.Id == product.Id).FirstOrDefault(); 
      product.Url = thisProduct.Url; 
     } 


    if (ModelState.IsValid) 
    { 
// had to use AddOrUpdate instead of Modified 

     db.Set<Product>().AddOrUpdate(product); 
     //db.Entry(product).State = EntityState.Modified; 
     db.SaveChanges(); 
     return RedirectToAction("Index"); 
    }