[英]How to refresh partial view in a .net-core mvc project
I have read multiple post on partial view but still can't figure out how it works. 我已阅读部分视图的多个帖子,但仍无法弄清楚它是如何工作的。 I have a main page, within if I have a partial view, basically rendering an image.
我有一个主页面,如果我有局部视图,基本上渲染图像。
I am "listening" a folder using FileSystemWatcher, when a new image arrives in it, depending on it's type it's doing some process and at the end of the process it should "refresh" the partial view. 我正在使用FileSystemWatcher“监听”一个文件夹,当一个新图像到达它时,取决于它正在进行某个过程的类型,并且在该过程结束时它应该“刷新”局部视图。
in the main cshtml "fullPage.cshtml" I did this: 在主cshtml“fullPage.cshtml”中我这样做了:
<div id="_PartialView">
<h2><b>Images:</b></h2>
@Html.Partial("PatialViewImage");
</div>
in the PartialViewImage.cshtml: 在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>
in the controller: 在控制器中:
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);
}
so when a new image is detected it goes into (in the controller class) : 因此,当检测到新图像时,它会进入(在控制器类中):
public void HandleNewJpeg(object sender, EventArgs e)
{
ViewBag.CurrentImage = _watcher.LastImageProcessed;
PartialView("PatialViewImage");
return;
}
but it doesn't do anything. 但它没有做任何事情。 when I debug: it stops at the line PartialView("PartialViewImage"), but it doesn't seem to go into PartialViewImage.cshtml and the fullPage is not uploaded.
当我调试时:它停在PartialView(“PartialViewImage”)行,但它似乎没有进入PartialViewImage.cshtml并且没有上传fullPage。
I tried to add in the fullPage.cshtml this javascript code: 我试着在fullPage.cshtml中添加这个javascript代码:
<script language="JavaScript" type="text/javascript">
$("@ViewBag.CurrentImage").change(function refresh)
function refresh() {
$("#_PartialView").load("/Views/PatialViewImage");
};
</script>
without success. 没有成功。 any idea how I could connect the FileSystemWatcher to my fullPage ?
任何想法如何将FileSystemWatcher连接到我的fullPage?
UPDATE UPDATE
in the full page I have add this: 在整页中我添加了这个:
$(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
}
});
to check time to time if I have a new image. 如果我有新图像,请不时查看。 from the filesystemwatcher event, I try to update a database define like this: in models:
从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; }
}
in startup.cs 在startup.cs中
services.AddDbContext<SQLDATABASEContext>(options => options.UseMySQL(Configuration.GetConnectionString("SQLDATABASE")));
services.AddDbContext<TempContext>(options => options.UseInMemoryDatabase("name"));
and in the controller: 并在控制器中:
public void HandleNewJpeg(object sender, EventArgs e)
{
_context2.Add<PathImages>(new PathImages { RawImage = _context._watcher.LatestJPEGThumb, IAImage = "" });
return;
}
but I get this error: 但我得到这个错误:
System.ObjectDisposedExceptionHResult Cannot access a disposed object
System.ObjectDisposedExceptionHResult无法访问已处置的对象
I still don't get how I can pass data from public void HandleNewJpeg(object sender, EventArgs e)
to a controller action. 我仍然不知道如何将数据从
public void HandleNewJpeg(object sender, EventArgs e)
传递给控制器动作。
You can use <partial>
tag helper, <div id="imageChanged"> <partial name="Partial/PatialViewImage" model="new ViewModel() { ImSrc = Model.ImSrc}" /> </div>
. 您可以使用
<partial>
标记助手, <div id="imageChanged"> <partial name="Partial/PatialViewImage" model="new ViewModel() { ImSrc = Model.ImSrc}" /> </div>
。 If you want refresh the page you need to have a controller action that will returns partial view. 如果要刷新页面,则需要具有将返回部分视图的控制器操作。
User JQuery with event or without event for example 用户JQuery,例如事件或没有事件
(function () {
$.ajax({
url: ROOT + 'Home/GetImage',
data: { imgId : @Model.ImgId },
type: 'POST',
success: function (data) {
$('#imageChanged').html(data);
},
error: function (res) {
}})
})();
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.