Есть сайт на ASP.Net mvc. Сайт отображает состояние множества устройств. Устройства пишут вне зависимости от самого сайта значения в БД (mysql). Страница представляет собой сборную солянку. В View одна подключенная модель, но в этой модели содержится список всех объектов. Например:
public class SyObVM
{
// список городов
public IEnumerable<CVM> Cities { get; set; }
//сообщения
public IEnumerable<Ev> Events { get; set; } таких коллекций несколько
}
Все эти коллекции собираются в контроллере и передаются в View.
Нужно реализовать следующую схему: Пользователь залогинился, отобразилась страница, 1 раз в n секунд проверялась определенная таблица, не появилось ли там чего то нового, если информация добавилась/изменилась необходимо обновлять всю страницу и сигнализировать звуком пользователю.
В БД ранее делал триггер, который пишет в другую таблицу, время и последний идентификатор.
Не знаю, как в asp net mvc сравнивать старое состояние с новым из БД и так каждый цикл и соответственно взаимодействовать с view.
Если бы приложение было десктопным, запомнил при старте значение, затем каждые n секунд брал бы текущее из нужной таблицы, сравнивал значения, если поменялось, оповещаю и меняю стартовое, если нет, продолжаю...
Наверно нужна связка с JS/Ajax..но опыта в вебе маловато.
Концепт. Так как вы не особо на js, то сделал вам простой пример на стареньком jquery.
У нас будет одна простая модель:
namespace WebApplication2.Models
{
public class Order
{
public int Id { get; set; }
public string Title { get; set; }
}
}
И демо-контроллер с выводом списка и выводом диффа:
public class OrderController : Controller
{
public ActionResult Index()
{
var model = new List<Order>
{
new Order { Id = 1, Title = "First order" },
new Order { Id = 2, Title = "Second order" },
};
return this.View(model);
}
public ActionResult GetNewRecords(int maxId)
{
var model = new List<Order>
{
new Order { Id = maxId + 1, Title = $"MaxId was {maxId}" },
};
return this.Json(model);
}
}
(Заполните вызовом из базы самостоятельно)
А это собственно сама view:
@model List<WebApplication2.Models.Order>
@{
ViewBag.Title = "Order monitor";
}
<h2>@ViewBag.Title</h2>
<table id="orders" class="table">
<tr>
<td>Id</td>
<td>Title</td>
</tr>
@foreach (var order in Model)
{
<tr>
<td data-id="@order.Id">@order.Id</td>
<td>@order.Title</td>
</tr>
}
</table>
<script type="text/javascript">
var timeout = setInterval(reloadRecords, 5000);
function reloadRecords () {
$.ajax({
type: "POST",
url: "@Url.Action("GetNewRecords", "Order")",
data: {
"maxId": getMaxId()
},
success: function (data) {
$(data).each(function(index, item) {
$(`<tr><td data-id="${item.Id}">${item.Id}</td><td>${item.Title}</td><tr>`).appendTo('#orders');
});
}
});
}
function getMaxId () {
var max = 0;
$('#orders tr td:first-child').each(function() {
max = Math.max($(this).data("id") || 0, max);
});
return max;
}
</script>
Вид через пару циклов:
Кофе для программистов: как напиток влияет на продуктивность кодеров?
Рекламные вывески: как привлечь внимание и увеличить продажи
Стратегії та тренди в SMM - Технології, що формують майбутнє сьогодні
Выделенный сервер, что это, для чего нужен и какие характеристики важны?
Современные решения для бизнеса: как облачные и виртуальные технологии меняют рынок
Хотел бы узнать есть ли хорошая и оптимизированная альтернатива моему кодуЭто код на якоря, выполненный на чистом js
У нас есть конструктор Menu, который помогает создать графический компонент из уже существующего элемента в DOMСам элемент передаём в конструтор,...
https://codepenio/Don2Quixote/full/wXdoRe