如何在不刷新页面的情况下显示不同的值 MVC C#
How to display different values without refreshing the page MVC C#
我有一个循环遍历值列表的方法,我想做的是当我打开页面时能够看到值的变化而不刷新当前视图。我试过类似下面的代码。
public static int myValueReader { get; set; }
public static void ValueGenerator()
{
foreach (var item in myList)
{
myValue = item;
Thread.Sleep(1000);
}
}
实际情况是,即使我关闭表单,我也希望它读取这些值。我想我需要分配一个任务才能执行此操作,但我一直在徘徊是否有更好的方法,因为它是一个 MVC 应用程序?
@DavidTansey 提到的最佳选择是使用 SignlarR。如果用户的浏览器不支持它,它会包装网络套接字并回退到 long polling/etc 。您的用户将订阅特定频道,然后您可以在这些频道中发起事件。
关于您的业务逻辑,您需要研究异步编程技术。一旦你开始这样做,你可能会有更具体的问题。
这是另一种方法:
- 使用AJAX和
setTimeout
- 在您的控制器中声明一项操作(这一项将 return 您的不同值)
- 您
ViewBag
中的一个整数,例如:ViewBag.totalItems
在您的控制器中声明一个操作: 这很重要,因为这将是您与数据库或数据的连接。此操作将接收 itemIndex 并将 return 该项目。像这样:
[HttpPost]
public JsonResult GetItem(int index) {
return Json(myList.ElementAt(index));
}
ViewBag.TotalItems:您的视图必须知道列表中有多少项。我建议您通过 ViewBag
:
将该值作为整数传递
public ActionResult Index() {
ViewBag.TotalItems = myList.Count();
return View();
}
AJAX 和 setTimeout
:一旦您拥有所有这些,您就可以在不刷新的情况下更新您的视图:
<script>
$(function() {
var totalItems = @Html.Raw(Json.Encode(ViewBag.TotalItems));
var currentItemIndex = 0;
var getData = function() {
$.post("@Url.Action("GetItem")", {index:currentItemIndex}, function(data) {
// data is myList.ElementAt(index)
// do something with it
}).always(function() {
currentItemIndex++;
if(currentItemIndex < totalItems) {
setTimeout(getData, 1000); // get the next item every 1 sec
}
})
}
getData(); // start updating
})
</script>
我有一个循环遍历值列表的方法,我想做的是当我打开页面时能够看到值的变化而不刷新当前视图。我试过类似下面的代码。
public static int myValueReader { get; set; }
public static void ValueGenerator()
{
foreach (var item in myList)
{
myValue = item;
Thread.Sleep(1000);
}
}
实际情况是,即使我关闭表单,我也希望它读取这些值。我想我需要分配一个任务才能执行此操作,但我一直在徘徊是否有更好的方法,因为它是一个 MVC 应用程序?
@DavidTansey 提到的最佳选择是使用 SignlarR。如果用户的浏览器不支持它,它会包装网络套接字并回退到 long polling/etc 。您的用户将订阅特定频道,然后您可以在这些频道中发起事件。
关于您的业务逻辑,您需要研究异步编程技术。一旦你开始这样做,你可能会有更具体的问题。
这是另一种方法:
- 使用AJAX和
setTimeout
- 在您的控制器中声明一项操作(这一项将 return 您的不同值)
- 您
ViewBag
中的一个整数,例如:ViewBag.totalItems
在您的控制器中声明一个操作: 这很重要,因为这将是您与数据库或数据的连接。此操作将接收 itemIndex 并将 return 该项目。像这样:
[HttpPost]
public JsonResult GetItem(int index) {
return Json(myList.ElementAt(index));
}
ViewBag.TotalItems:您的视图必须知道列表中有多少项。我建议您通过 ViewBag
:
public ActionResult Index() {
ViewBag.TotalItems = myList.Count();
return View();
}
AJAX 和 setTimeout
:一旦您拥有所有这些,您就可以在不刷新的情况下更新您的视图:
<script>
$(function() {
var totalItems = @Html.Raw(Json.Encode(ViewBag.TotalItems));
var currentItemIndex = 0;
var getData = function() {
$.post("@Url.Action("GetItem")", {index:currentItemIndex}, function(data) {
// data is myList.ElementAt(index)
// do something with it
}).always(function() {
currentItemIndex++;
if(currentItemIndex < totalItems) {
setTimeout(getData, 1000); // get the next item every 1 sec
}
})
}
getData(); // start updating
})
</script>