【发布时间】：2020-05-05 08:09:19
【问题描述】：
我在网上找到了如何将用户上传的图像提交到我的数据库中。这是我使用的代码：
创建.cshtml
@page
@model SummerFling.Pages.Products.CreateModel
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Create</title>
</head>
<body>
<h4>Product</h4>
<hr />
<div class="row">
<div class="col-md-4">
<form enctype="multipart/form-data" method="post">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<div class="form-group">
<label asp-for="Product.ProductName" class="control-label"></label>
<input asp-for="Product.ProductName" class="form-control" required />
<span asp-validation-for="Product.ProductName" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="Product.ProductShortDesc" class="control-label"></label>
<input asp-for="Product.ProductShortDesc" class="form-control" required />
<span asp-validation-for="Product.ProductShortDesc" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="Product.ProductLongDesc" class="control-label"></label>
<input asp-for="Product.ProductLongDesc" class="form-control" required />
<span asp-validation-for="Product.ProductLongDesc" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="Product.ProductPrice" class="control-label"></label>
<input asp-for="Product.ProductPrice" class="form-control" required />
<span asp-validation-for="Product.ProductPrice" class="text-danger"></span>
</div>
<dl>
<dt>
<label asp-for="FileUpload.FormFile"></label>
</dt>
<dd>
<input asp-for="FileUpload.FormFile" type="file" required>
</dd>
</dl>
<div class="form-group">
<input type="submit" value="Create" class="btn btn-primary" />
</div>
</form>
</div>
</div>
<div>
<a asp-page="Index">Back to List</a>
</div>
@section Scripts {
@{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}
</body>
</html>
在 Create.cshtml.cs 类文件中，我有从表单获取数据并将其提交到我的数据库的代码：
创建.cshtml.cs
// To protect from overposting attacks, please enable the specific properties you want to bind to, for
// more details see https://aka.ms/RazorPagesCRUD.
public async Task<IActionResult> OnPostAsync()
{
if (!ModelState.IsValid)
{
return Page();
}
using (var memoryStream = new MemoryStream())
{
await FileUpload.FormFile.CopyToAsync(memoryStream);
// Upload the file if less than 2 MB
if (memoryStream.Length < 2097152)
{
var imageRecord = new Image()
{
ProductImage1 = memoryStream.ToArray()
};
_context.Image.Add(imageRecord); // Add the created image record to the Image database.
await _context.SaveChangesAsync();
_context.Product.Add(Product); // Add the created product record to the Product database
await _context.SaveChangesAsync();
return RedirectToPage("./Index");
}
else
{
ModelState.AddModelError("File", "The file is too large.");
return Page();
}
}
}
现在，在 /Index 页面上，我想获取存储在我的数据库中的所有数据并将其显示在页面上。我对存储在 Product 表中的数据执行此操作没有问题，但我很难理解如何对存储在 Image 表中的图像执行此操作的逻辑。
Index.cshtml
@page
@model SummerFling.Pages.Products.IndexModel
@using WebMatrix.Data;
@{
Layout = null;
var queryString = "SELECT ProductImage1 FROM Image WHERE ProductID LIKE @0";
var db = Database.Open("SummerFlingProductContext");
// appsettings.json
// "ConnectionStrings": {
// "SummerFlingProductContext": "Server=127.0.0.1,1433;Database=SummerFling;User Id=SA;Password=******;MultipleActiveResultSets=true"
// }
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<p>
<a asp-page="Create">Create New</a>
</p>
<table class="table">
<thead>
<tr>
<th>
@Html.DisplayNameFor(model => model.Product[0].ProductName)
</th>
<th>
@Html.DisplayNameFor(model => model.Product[0].ProductShortDesc)
</th>
<th>
@Html.DisplayNameFor(model => model.Product[0].ProductLongDesc)
</th>
<th>
@Html.DisplayNameFor(model => model.Product[0].ProductPrice)
</th>
<th></th>
</tr>
</thead>
<tbody>
@foreach (var item in Model.Product)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.ProductName)
</td>
<td>
@Html.DisplayFor(modelItem => item.ProductShortDesc)
</td>
<td>
@Html.DisplayFor(modelItem => item.ProductLongDesc)
</td>
<td>
@Html.DisplayFor(modelItem => item.ProductPrice)
</td>
<td>
@db.QuerySingle(queryString, item.ProductID);
</td>
<td>
<a asp-page="./Edit" asp-route-id="@item.ProductID">Edit</a> |
<a asp-page="./Details" asp-route-id="@item.ProductID">Details</a> |
<a asp-page="./Delete" asp-route-id="@item.ProductID">Delete</a>
</td>
</tr>
}
</tbody>
</table>
</body>
</html>
Index.cshtml.cs
namespace SummerFling.Pages.Products
{
public class IndexModel : PageModel
{
private readonly SummerFling.Data.SummerFlingProductContext _context;
public IndexModel(SummerFling.Data.SummerFlingProductContext context)
{
_context = context;
}
public IList<Product> Product { get; set; }
public IList<Image> Image { get; set; }
public async Task OnGetAsync()
{
Product = await _context.Product.ToListAsync();
IList<Image> Image = await _context.Image.ToListAsync();
}
}
}
我正在努力弄清楚我应该在哪里以及如何编写逻辑以从 Image 表中获取图像并将图像与每行的所有其他数据一起显示。 （现在，Image 表中的条目 1 包含与 Product 表中的条目 1 相关的图像。
我是否在 .cshtml.cs 文件中以与从 Product 表中检索数据类似的方式对此进行编码？我该怎么做？
【问题讨论】：
标签： c# sql asp.net entity-framework razor