c# - 如何使用 ASP.NET MVC 在“编辑产品”上加载图像?
问题描述
我有一个用于 ASP.NET MVC 中产品的库存 CRUD 模块。在数据库中插入新产品时,我必须为每个产品加载图像。
我的问题是当我想编辑给定 ID 中的现有产品时,当编辑产品时,文本成功加载但图像没有。问题是我不知道该怎么做。
这是我的代码:
插入新产品:
@using (Html.BeginForm("NuevoProducto", "Inventario", FormMethod.Post, new { enctype =
"multipart/form-data" }))
{
...
<div class="form-group">
<label for="exampleInputFile">Imagen</label>
<div class="input-group">
<div class="custom-file">
<input type="file" id="file" name="Image" class="custom-file-input" multiple onchange="GetFileSize()" />
<label class="custom-file-label" for="exampleInputFile">Elija Imagen</label>
</div>
</div>
@Html.ValidationMessageFor(m => m.Image, "", new { @class = "text-danger" })
<div class="col-2">
<p>Tamaño de Imagen</p>
</div>
</div>
}
[HttpPost]
public ActionResult NuevoProducto(ProductoViewModel viewModel)
{
string path = "";
HttpPostedFileBase archivo = Request.Files["Image"];
if (ModelState.IsValid)
{
if (archivo != null && archivo.ContentLength > 0)
{
path = Path.Combine(Server.MapPath("~/Images"), Path.GetFileName(archivo.FileName));
archivo.SaveAs(path);
}
if (ModelState.IsValid)
{
var producto = viewModel.Producto;
producto.FechaCreacion = DateTime.Now;
producto.Estado = true;
producto.Imagen = viewModel.Image.FileName;
_productosRepository.Add(producto);
TempData["Message"] = "¡El Producto se ha INSERTADO con éxito!";
return RedirectToAction("Productos");
}
}
viewModel.Iniciar(_productosRepository);
return View(viewModel);
}
public class ProductoViewModel
{
public Producto Producto { get; set; } = new Producto();
[Required(ErrorMessage = "*Se necesita una imagen.")]
public HttpPostedFileBase Image { get; set; }
}
这是我用于编辑产品但图像未加载的代码:
public ActionResult ModificarProducto(int? id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
var producto = _productosRepository.Get((int)id, incluideRelatedEntities: false);
if (producto == null)
{
return HttpNotFound();
}
//necesito capturar los datos y almacenarlos en viewmodel
var viewModel = new ProductoEditViewModel()
{
Producto = producto
};
viewModel.Iniciar(_productosRepository);
return View(viewModel);
}
[HttpPost]
public ActionResult ModificarProducto(ProductoEditViewModel viewModel)
{
if (ModelState.IsValid)
{
var producto = viewModel.Producto;
_productosRepository.ModificarProducto(producto);
TempData["Message"] = "¡El Producto se ha MODIFICADO con éxito!";
return RedirectToAction("DetallesProducto", "Inventario", new {viewModel.Id});
}
viewModel.Iniciar(_productosRepository);
return View(viewModel);
}
我将存储在图像文件夹中的图像的路径保存在数据库中,并使用
<img src="~/Images/@producto.Imagen" height="100" />
. 我不知道如何在编辑视图中加载图像并使我的客户更容易,因为保存在编辑视图中的图像是空的。
解决方案
单击编辑按钮后,将图像名称和路径存储在 tempdata 中,并在更新期间从 tempdata 中取回。
推荐阅读
- rust - 如何从产生数据块的慢速处理侧线程流式传输超级请求的正文?
- xml - XmlStreamingMarkupBuilder 不接受绑定到版本 2.5.7 的 xmlns 命名空间
- python - python - 模拟和单元测试更改输入列表的方法链
- vue.js - Nuxt生产模式加载资源延迟
- arrays - 在数组中查找字符串时出现类型不匹配
- javascript - 从javascript中的单词中删除字母
- cmake - 如何在 CMakeLists.txt 中调用多个 toolchain.cmake 文件
- c++ - 在 COM 中调用 QueryInterface() 是绝对必要的吗?
- python - 使用重复的优先级将 Torch 张量插入 heapq 时出错
- encryption - 如果我将新的 env var 提交到加密的机密文件,并且 var 名称可以从提交消息中识别,那么安全性会降低多少?