Показывать индикатор выполнения при выполнении метода завершение

Question

У меня есть веб-страница ASP.NET, у которой есть datagrid. Нагрузочный файл загружается при событии нажатия кнопки. Перед загрузкой datagrid есть некоторые способы выполнения, и для получения данных требуется некоторое время. Я хочу показать индикатор выполнения, отображающий индикатор ожидания пользователю до загрузки сетки. Каков наилучший способ сделать это?

protected void btnStart_Click(object sender, ImageClickEventArgs e) { 

    _bw = new BackgroundWorker(); 
    _bw.DoWork += bw_DoWork; 
    _bw.RunWorkerCompleted += bw_RunWorkerCompleted; 
    _bw.RunWorkerAsync(); 
    waiting.Style["display"] = "inline"; 
    divDataGrid.Style["display"] = "none"; 
} 

private void bw_DoWork(object sender, DoWorkEventArgs e) 
    { 
     BackgroundWorker worker = sender as BackgroundWorker; 
     int n = Convert.ToInt32(e.Argument); 
     e.Result = PerformBinding(n, worker, e); 
    } 

private bool PerformBinding(int n, BackgroundWorker worker, DoWorkEventArgs e) 
    { 
     Service.Start(); 
     BindDataGrid(); 
     return true; 
    } 


private void BindDataGrid() 
{ 
    //take some time to get data 
} 

private void bw_RunWorkerCompleted(object sender, 
             RunWorkerCompletedEventArgs e) 
    { 
     waiting.Style["display"] = "none"; 
     divDataGrid.Style["display"] = "inline"; 
    } 

здесь «ожидание» является тэг ДИВЫМ идентификатором для ожидания прогресса бара и «divDataGrid» является Div тега, содержащего эту сетку.

Answer 1

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

Answer 2

Как и было предложено, вы можете использовать управление UpdatePanel. Внутри него вам нужно будет установить UpdateProgress и добавить spinning icon там:

<asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
<ContentTemplate> 
      <!-- Your controls here --> 
    <updateprogress> 
     <progresstemplate> 
       <img src="images/loading.gif"> 
      </progresstemplate> 
    </updateprogress> 
</ContentTemplate> 
<Triggers> 
    <asp:AsyncPostBackTrigger /> 
</Triggers> 

Answer 3

Во-первых, BackgroundWorker класс не предназначен для использования в среде ASP, и не собирается, чтобы помочь вы. Тебе лучше не использовать его вообще.

Создание этого поведения в ASP много сложнее, чем в настольном приложении. Это связано с тем, что у вас нет надлежащей двусторонней связи между клиентом и сервером. В HTTP клиент делает запрос, и он получает один ответ. Сервер не может просто отправить данные произвольно клиенту (если он просто будет проигнорирован).

Что вам нужно сделать, это начать с создания нового потока для асинхронной обработки. (Вероятно, вам лучше всего использовать класс Thread, поток потоков нитей вряд ли будет полезен, и ни один из других инструментов, которые строятся поверх Thread, такие как работник фона, задача и т. Д., Действительно помогают в этом на всех.) Затем вам нужно, чтобы поток выполнял работу, сохраняя некоторую информацию о текущем прогрессе в Session или в какой-то другой форме постоянного состояния (другая база данных или другое внешнее хранилище). Наконец, вам нужно иметь клиентский (что означает javascript) на странице, которая постоянно проверяет сервер, проверяет, что постоянное хранилище для прогресса, и соответственно обновляет клиент. Это как высоко неэффективен для сервера, а занимает довольно много времени для разработки.

Here является примером MSDN этого подхода.

Answer 4

Спасибо всем. Я нашел простое решение.

<asp:ImageButton ID="btnStart" runat="server" src="images/Play.png" OnClick="btnStart_Click" OnClientClick="document.getElementById('waiting').style.display='block';" /> 

<div id="waiting" style="position: left: 0px; top: 0px; background-color: white; 
          height: 100%; width: 100%; display:none" align="center" runat="server" > 
          <img src="images/progress.gif" height="60px" /> 
         </div> 

protected void btnStart_Click(object sender, ImageClickEventArgs e) 
    { 
     Service.Start(); 
     BindDataGrid(); 
     waiting.Style.Add("display", "none;"); 
    }