如何刷新.net核心mvc项目中的局部视图

时间:2019-04-15 12:31:16

标签: c# asp.net-core asp.net-core-mvc

我已经阅读了多篇关于局部视图的文章,但仍然不知道它是如何工作的。 我有一个主页,如果有部分视图,基本上可以在其中渲染图像。

我正在使用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.cshtml中添加以下javascript代码:

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

</script>

没有成功。 知道如何将FileSystemWatcher连接到我的整页吗?

更新

在整页中我添加了:

$(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)传递到控制器操作。

1 个答案:

答案 0 :(得分:0)

您可以使用<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) {
                    }})
    })();