如何刷新.net-core mvc项目中的局部视图

Question

我已阅读部分视图的多个帖子，但仍无法弄清楚它是如何工作的。 我有一个主页面，如果我有局部视图，基本上渲染图像。

我正在使用FileSystemWatcher“监听”一个文件夹，当一个新图像到达它时，取决于它正在进行某个过程的类型，并且在该过程结束时它应该“刷新”局部视图。

在主cshtml“fullPage.cshtml”中我这样做了：

<div id="_PartialView">
    <h2><b>Images:</b></h2>
    @Html.Partial("PatialViewImage");
</div>

在PartialViewImage.cshtml中：

<div style="text-align:center">
    <img id="img_logo" alt="AIExampleResult" src=@ViewBag.CurrentImage style="margin-left:auto;margin-right:auto;width:80%" />
   <h3>ImageProperties: @ViewBag.Resolution etc ...</h3>
</div>

在控制器中：

public async Task<IActionResult> fullPage(int? id)
{
   if (id == null)
{
   return NotFound();
}

var patientdata = await _context.Patientdata
    .FirstOrDefaultAsync(m => m.IdPatient == id);
if (patientdata == null)
 {
  return NotFound();
 }

//start to listen dragonfly folder
_watcher = new FolderWatcher();
_watcher.PathToWatch = _configuration["ConfigFolderListner:ImagesFolder"];
_watcher.patientdata = patientdata;
_watcher.Run();
_watcher.PropertyChanged += HandleNewJImage;
return View(patientdata);
}

因此，当检测到新图像时，它会进入（在控制器类中）：

public void HandleNewJpeg(object sender, EventArgs e)
{
    ViewBag.CurrentImage = _watcher.LastImageProcessed;
    PartialView("PatialViewImage");
    return;
}

但它没有做任何事情。 当我调试时：它停在PartialView（“PartialViewImage”）行，但它似乎没有进入PartialViewImage.cshtml并且没有上传fullPage。

我试着在fullPage.cshtml中添加这个javascript代码：

<script language="JavaScript" type="text/javascript">
$("@ViewBag.CurrentImage").change(function refresh)
    function refresh() {
        $("#_PartialView").load("/Views/PatialViewImage");
    };

</script>

没有成功。 任何想法如何将FileSystemWatcher连接到我的fullPage？

UPDATE

在整页中我添加了这个：

$(document).ready(function () {
  CheckNewImages();
  var refreshId = window.setInterval(function () {
    CheckNewImages();
  }, 2000);
});

function CheckNewImages() {
  $.ajax({
  url: "@Url.Action("ReportPartialView")",
  type: "POST",
  dataType: "html",
  data: {id : @Model.IdPatient},
  success: function (data) {
   $('#_ReportPartialView').html(data);
   clearInterval(refreshId);
  },
  fail: function () {
   //do nothing
  }
});

如果我有新图像，请不时查看。 从filesystemwatcher事件，我尝试更新这样的数据库定义：在模型中：

public class PathImages
{
  public int Id { get; set; }

  public string RawImage { get; set; }

  public string IAImage { get; set; }
}

public class TempContext : DbContext
{
 public TempContext(DbContextOptions options) : base(options)
 { }

 public DbSet<PathImages> PathImages { get; set; }
}

在startup.cs中

services.AddDbContext<SQLDATABASEContext>(options => options.UseMySQL(Configuration.GetConnectionString("SQLDATABASE")));
services.AddDbContext<TempContext>(options => options.UseInMemoryDatabase("name"));

并在控制器中：

public void HandleNewJpeg(object sender, EventArgs e)
{
    _context2.Add<PathImages>(new PathImages { RawImage = _context._watcher.LatestJPEGThumb, IAImage = "" });
    return;
}

但我得到这个错误：

System.ObjectDisposedExceptionHResult无法访问已处置的对象

我仍然不知道如何将数据从public void HandleNewJpeg(object sender, EventArgs e)传递给控制器​​动作。

Answer 1

您可以使用<partial>标记助手， <div id="imageChanged"> <partial name="Partial/PatialViewImage" model="new ViewModel() { ImSrc = Model.ImSrc}" /> </div> 。 如果要刷新页面，则需要具有将返回部分视图的控制器操作。

用户JQuery，例如事件或没有事件

 (function () {
    $.ajax({
            url: ROOT + 'Home/GetImage',
            data: { imgId : @Model.ImgId },
            type: 'POST',
            success: function (data) {
                     $('#imageChanged').html(data);
                    },
                    error: function (res) {
                    }})
    })();