Как загрузить Div с JQuery AJAX и setInterval в MVC 5? - PullRequest
0 голосов
/ 01 ноября 2018

Я работаю с JQuery Ajax. Я хочу загружать данные моей таблицы каждые 5 секунд. Вот что я пробовал, но это не работает. Он не возвращает ни ошибки, ни результата.

public ActionResult Index()
{
  return View();
}

public PartialViewResult _List()
{
  List<Purchase> model = db.Purchases.ToList();
  return PartialView("_List", model);
}
<div id="loadList"></div>

@section scripts{
  <script>
    $(document).ready(function () {
      setInterval(function () {
        $("#loadList").load("~/Views/Purchases/_List.cshtml");
      }, 3000);
    });
  </script>
}

Частичное представление, которое я хочу загрузить в #loadList div.

@model IEnumerable<ChocolateFactory.Data.Purchase>

<table class="table">
<tr>
    <th>@Html.DisplayNameFor(model => model.RefNo)</th>
    <th>@Html.DisplayNameFor(model => model.Date)</th>
    <th>@Html.DisplayNameFor(model => model.Amount)</th>
</tr>
@foreach (var item in Model) {
<tr>
    <td>@Html.DisplayFor(modelItem => item.RefNo)</td>
    <td>@Html.DisplayFor(modelItem => item.Date)</td>
    <td>@Html.DisplayFor(modelItem => item.Amount)</td>
</tr>
}
</table>

Частичное представление в:

~/Views/Purchases/_List.cshtml

1 Ответ

0 голосов
/ 01 ноября 2018

Проблема в том, что символ тильды - это конструкция Razor для корня сайта. Он не распознается за пределами этого, следовательно, он не будет работать в вашем коде JS. Поскольку вы поместили эту логику в представление, вы можете использовать @Url.Content() для анализа URL-адреса перед его выводом на JS:

setInterval(function () {
  $("#loadList").load("@Url.Content("~/Views/Purchases/_List.cshtml")");
}, 3000);

Также обратите внимание, что если ваша маршрутизация настроена правильно, вы можете использовать Url.Action(), который был бы более надежным, например, @Url.Action("_List", "ControllerNameHere");

Однако , следует отметить, что отправка AJAX-запроса на ваш сервер каждые 3 секунды не является хорошей идеей. Он вообще не масштабируется и вызовет проблемы с производительностью. Если вам необходимо поддерживать тесную синхронизацию обслуживаемых данных и клиентского интерфейса, то гораздо лучше будет использовать отправленные сервером события или WebSockets.

...