Отображение «Загрузка» при загрузке данных с контроллера

Question

У меня есть функция, которая получает много данных из Интернета. Для получения всех данных требуется около 15 секунд. Как я могу отобразить текст (например, «загрузка данных»), пока он по-прежнему загружается. Прямо сейчас, это выглядит следующим образом:

1. Я войти на страницу

2. Мой «Индекс» загружает свою функцию «LoadData».

3. Функция сохраняет данные в ViewBags

4. Функция возвращает Посмотреть

В Вид:

<table class='table' id='vmTable' border='1'> 
    <tr> 
     <th>VM Name</th> 
     <th>Status</th> 
     <th>Shutdown Time</th> 
     <th>Service Name</th> 
     <th>Created Date</th> 
     <th>Last Modified</th> 
     <th>Port</th> 
    </tr> 

    @for (int i = 0; i < ViewBag.AmountOfVms; i++) 
    { 
     <tr class="tableColumn vmColumn"> 
      <td class="vmName">@ViewBag.VMs[i, 0]</td> 
      <td class="vmStatus">@ViewBag.VMs[i, 1]</td> 
      <td class="vmShutDown">@ViewBag.VMs[i, 6]</td> 
      <td class="vmServiceName">@ViewBag.VMs[i, 2]</td> 
      <td class="vmCreatedDate">@ViewBag.VMs[i, 3]</td> 
      <td class="vmLastModified">@ViewBag.VMs[i, 4]</td> 
      <td class="vmPort">@ViewBag.VMs[i, 7]</td> 
     </tr> 
    } 

</table> 

Ive слышал о Ajax и с использованием частичных представлений. Таким образом, я могу показать свою таблицу в качестве частичного просмотра и просто сказать

@if (ViewBag.VMs[i, 0] == null) 
{ 
    <td>Loading...</td> 
} 

, а затем обновите Частичный вид каждый второй? И как я могу запустить свою функцию «LoadData», находясь на странице. Или другими словами: Как я могу просто показать «загрузку», пока ViewBag имеет значение NULL.

У вас есть хорошие примеры для этого? ¨

Answer 1

Прежде всего я бы рекомендовал вам начать работу с использованием модели вместо ViewBag.

ViewBag vs Model, in MVC.NET

Во-вторых вы просто использовать технологию Ajax :)

Render Partial View Using jQuery in ASP.NET MVC

Вы можете увидеть пример здесь :)

Answer 2

код Бритва вычисляется на стороне сервера. Это означает, что после того, как клиент загрузил представление, кода больше не запускать. Страница просто сидит там. Вы не можете написать цикл while (в Razor), который загружает частичный вид, если viewbag пуст. Вам нужно сделать это в JavaScript.

Если вы хотите, чтобы страница постоянно обновлялась, вам понадобится таймер. Используйте jQuery .get(), чтобы загрузить частичный вид через AJAX. При использовании AJAX для обработки запроса вы можете использовать jQuery .ajaxStart() и .ajaxComplete(), чтобы показать и скрыть ярлык «Загрузка ...».

.get()

.ajaxStart()

.ajaxComplete()