部分视图文件上载
本文关键字:上载 文件 视图 | 更新日期: 2023-09-27 18:29:02
我正试图弄清楚如何使用局部视图存储多个文件。可以看到部分视图的屏幕截图在这里
只要我使用正则形式的输入,局部视图本身就可以完美地工作。然而,存储文件有点复杂。由于我使用的是EntityFirst,所以我只是存储对文件的引用,而不是实际文件本身。这适用于单个文件。字节引用存储到我的数据库中,我可以在显示某个记录的所有属性的视图中生成指向该文件的链接。然而,如果我想要多次上传,我不知道该如何解决这个问题。每增加一行一个。
我也不确定如何通过jQuery针对某一行的单独字段,因为所有行都是动态生成的,但这是另一个问题。
相关代码:
我的控制器的POST操作:
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult CreateSrv([Bind(Include = "ID,CreationTimestamp,EditTimestamp,requestStatus,Requester,Reponsible,DeliveryDate,Project,CostCenter, MailCounter, ExtendedOrders")] Request request, HttpPostedFileBase upload)
{
if (ModelState.IsValid)
{
if (upload != null && upload.ContentLength > 0)
{
if (upload.ContentLength > 0)
{
var fileName = Path.GetFileName(upload.FileName);
var path = Path.Combine(Server.MapPath("~/App_Data/uploads"), fileName);
upload.SaveAs(path);
using (var reader = new System.IO.BinaryReader(upload.InputStream))
{
request.ExtendedOrders.ToArray()[0].File = reader.ReadBytes(upload.ContentLength);
}
}
}
request.CreationTimestamp = DateTime.Now;
request.EditTimestamp = DateTime.Now;
request.RequestStatus = "Initial";
request.RequestType = "Services";
db.requests.Add(request);
db.SaveChanges();
return RedirectToAction("Index");
}
return View(request);
}
使用AJAX将行添加到部分视图的控制器方法:
[HttpGet]
public ActionResult AddOrderRowExtended()
{
OrderExtended order = new OrderExtended();
order.Units = GetSelectListItems(GetUnitsFromDB());
order.Unit = "PC";
order.Currencies = GetSelectListItems(GetCurrenciesFromDB());
order.Currency = "European Euro";
return PartialView("~/Views/Orders/OrderExtendedCreate.cshtml", order);
}
然后我在我的";主";看法addOrder按钮动态添加更多行:
@using (Html.BeginForm("CreateSrv", "Requests", null, FormMethod.Post, new { enctype = "multipart/form-data" }))
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
... some fields of my Request model...
<tbody id="OrderZone">
@foreach (var row in Model.ExtendedOrders)
{
Html.RenderPartial("~/Views/Orders/OrderExtendedCreate.cshtml", row);
}
</tbody>
<button class="btn btn-sm btn-success" type="button" id="addOrder">Add row</button>
<br />
<div class="body-content">
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
</div>
我的订单扩展模型:
public class OrderExtended
{
[DatabaseGenerated(DatabaseGeneratedOption.Identity)]
public int ID { get; set; }
....
[NotMapped]
[DataType(DataType.Upload)]
public HttpPostedFileBase Quotation { get; set; }
public byte[] File { get; set; }
//FK
public int RequestRefId { get; set; }
[ForeignKey("RequestRefId")]
public virtual Request Request { get; set; }
}
OrderExtendedCreate.cshtml
@model RFP_MVC.Models.OrderExtended
<tr class="editorRow">
@using (Html.BeginCollectionItem("ExtendedOrders"))
{
<td class="col-md-2">@Html.EditorFor(model => model.Material, new { htmlAttributes = new { @class = "input-sm form-control" } })</td>
<td class="col-md-1">@Html.EditorFor(model => model.Quantity, new { htmlAttributes = new { @class = "input-sm form-control" } })</td>
<td class="col-md-2">@Html.DropDownListFor(model => model.Unit, Model.Units, new { id = "Unit", @class = "input-sm form-control select2" })</td>
<td class="col-md-2">@Html.DropDownListFor(model => model.PurchGroup, Model.PurchGroupList, "Select...", new { @class = "input-sm form-control" })</td>
<td class="col-md-2">
<div class="input-group">
<span class="input-group-btn">
<button class="btn btn-sm btn-default" type="button" data-toggle="modal" data-target="#myModal"><span class="glyphicon glyphicon-search"></span></button>
</span>
@Html.EditorFor(model => model.Vendor, new { htmlAttributes = new { id = "Vendor" , @class = "input-sm form-control" } })
</div>
</td>
<td class="col-md-1">@Html.EditorFor(model => model.OrderingCode, new { htmlAttributes = new { @class = "input-sm form-control" } })</td>
<td class="col-md-1">@Html.EditorFor(model => model.Price, new { htmlAttributes = new { @class = "input-sm form-control" } })</td>
<td class="col-md-1">@Html.DropDownListFor(model => model.Currency, Model.Currencies, new { id = "Currency", @class = "input-sm form-control select2" })</td>
<td class="col-md-2">
<span class="btn btn-sm btn-default btn-file glyphicon glyphicon-folder-open"><input type="file" name="upload"></span>
</td>
}
</tr>
提前感谢
更新了解决方案:
更改了我的POST方法
将参数更改为IEnumerable(如ramiramilu所建议的):
IEnumerable文件
循环浏览所有文件并处理它们:
int fileIndex = 0;
foreach (HttpPostedFileBase upload in files)
{
if (upload != null && upload.ContentLength > 0)
{
var fileName = Path.GetFileName(upload.FileName);
var path = Path.Combine(Server.MapPath("~/uploads"), fileName);
upload.SaveAs(path);
using (var reader = new System.IO.BinaryReader(upload.InputStream))
{
request.ExtendedOrders.ToArray()[fileIndex].File = reader.ReadBytes(upload.ContentLength);
}
fileIndex++;
}
}
如果要上载多个文件,则需要将IEnumerable<HttpPostedFileBase> upload
作为Action的参数。获得IEnumerable<HttpPostedFileBase> upload
后,使用foreach
并保存每个文件。
您可以使用以下代码使用部分视图上传文件。创建一个文件上传控制器。
public class FileUploadController : Controller
{
//
// GET: /FileUpload/
public ActionResult Index()
{
return View();
}
public ActionResult UploadFile()
{
var httpPostedFileBase = Request.Files["FileName"];
if (httpPostedFileBase != null && httpPostedFileBase.ContentLength > 0)
{
string extension = System.IO.Path.GetExtension(httpPostedFileBase.FileName);
string path1 = string.Format("{0}/{1}", Server.MapPath("~/SavedFiles"), extension);
if (System.IO.File.Exists(path1))
System.IO.File.Delete(path1);
httpPostedFileBase.SaveAs(path1);
}
ViewData["Status"] = "Success";
return View("Index");
}
}
存在局部视图的主视图。
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<div>
//like wise you can call the fileupload partial view in multiple views
@Html.Partial("_FileUpload")
</div>
</body>
</html>
你的部分是这样的。。
@using(Html.BeginForm("UploadFile","FileUpload",FormMethod.Post,new{enctype="multipart/form-data"}))
{
<input type="file" name="FileName" id="file" style="width:240px"/>
<input type="submit" value="Upload"/>
}
你也可以查看这篇文章。。
http://haacked.com/archive/2010/07/16/uploading-files-with-aspnetmvc.aspx/
希望这对你有帮助。感谢