我在 MVC5 中有一个部分视图，它显示文档查看器和一个允许用户上传文档的按钮。 我希望能够在上传文档时重新加载部分视图的内容，或者仅重新加载整个部分视图本身，以便用户上传的文档在上传完成后立即可见。
这是文档查看器：
@{
ViewBag.Title = ViewBag.PageTitle;
Layout = null;
}
@using GleamTech.AspNet.Mvc;
@using GleamTech.DocumentUltimate;
@using GleamTech.DocumentUltimate.AspNet;
@using GleamTech.DocumentUltimate.AspNet.UI;
<!DOCTYPE html>
@{
var documentViewer = new DocumentViewer
{
Width = 800,
Height = 600,
Document = @ViewBag.documentFile
};
}
<html>
<head>
@this.RenderHead(documentViewer)
</head>
<body>
@this.RenderBody(documentViewer)
</body>
</html>
文档查看器的名称如下：
public ActionResult ViewSanctionDocument(long id)
{
var lstData = EmployeeMemoServices.GetEmployeeMemo(_usrInfo, id);
string filePath = "";
if (lstData.EmployeeDocImg != null)
{
filePath = Server.MapPath(lstData.EmployeeDocImg.Substring(3, lstData.EmployeeDocImg.Length - 3).ToString());
}
ViewBag.documentFile = filePath;
return View();
}
这是显示：
@if (Model.EmployeeDocImg != null)
{
@Html.Action("ViewSanctionDocument", "TransactionSanction", new { id = @Model.Id })
}
else
{
<div class="dt-center justify-content-center col-md-12">
<img class="rounded-lg figure-img img-fluid col-md-8" id="empimgPreview" src="../../Images/no-image.jpg" />
</div>
}
</div>
这就是触发上传的原因，也是我计划触发部分视图重新加载的地方：
$('#btnEmpSancSave').change(function () {
var empNo = $(this).attr('bId')
var data = new FormData();
var files = $(this).get(0).files;
if (files.length > 0) {
data.append("MikeImages", files[0]);
data.append("EmployeeId", empNo);
}
$.ajax({
url: '@Url.Action(actionName: "SanctionDocumentSavingImage", controllerName: "TransactionSanction")',
type: "POST",
processData: false,
contentType: false,
data: data,
done: function (data) {
$("#viewid").html(data); //test
},
complete: function () {
alert('test'); //test
}
});
});
到目前为止，我已经尝试过做很多我在这里看到的事情，但没有一个起作用。
看起来您正在尝试在上传文档后重新加载部分视图。 在您的控制器中，您可以返回 PartialView 而不是 View：
public PartialViewResult ViewSanctionDocument(long id)
{
var lstData = EmployeeMemoServices.GetEmployeeMemo(_usrInfo, id);
string filePath = "";
if (lstData.EmployeeDocImg != null)
{
filePath = Server.MapPath(lstData.EmployeeDocImg.Substring(3, lstData.EmployeeDocImg.Length - 3).ToString());
}
ViewBag.documentFile = filePath;
return PartialView("_DocumentViewer");
}
在显示部分视图的主视图中，您可以使用 div 标签来加载部分视图：
<div id="documentViewerPartial">
@Html.Action("ViewSanctionDocument", "TransactionSanction", new { id = @Model.Id })
</div>
然后，在您上传文档的 jQuery 代码中，上传成功后，您可以像这样重新加载部分视图：
$.ajax({
url: '@Url.Action("SanctionDocumentSavingImage", "TransactionSanction")',
type: 'POST',
processData: false,
contentType: false,
data: data,
success: function (response) {
$("#documentViewerPartial").load(location.href + " #documentViewerPartial");
}
});