Показать UpdateProgress, пока набор данных не будет заполнен - PullRequest
Новая
       30

Показать UpdateProgress, пока набор данных не будет заполнен

1 голос
/ 12 сентября 2011

Я использую ProgressBar, как показано ниже: 

<ajaxToolkit:ModalPopupExtender ID="mpeWait" runat="server" Drag="false" PopupControlID="pnlWaitDialog"
    TargetControlID="btnDummy" EnableViewState="true" BackgroundCssClass="modalBackground">
</ajaxToolkit:ModalPopupExtender>
<asp:Button runat="server" ID="btnDummy" Style="display: none;" />
<div id="pnlWaitDialog" runat="server" 
    style="display: none; background-color: Transparent; position: absolute;">
    <div align="center">
        <img src="Images/Loading.gif" alt="" />
    </div>
</div>

Теперь мне нужно показать, что если для заполнения DataSet (для экспорта в Excel) требуется время.Можно ли это показать?

1 Ответ

1 голос
/ 12 сентября 2011

Я предполагаю, что DataSet заполняется каким-либо событием щелчка? Вы пытались использовать фактический элемент управления UpdateProgress? 

<asp:UpdateProgress ID="prgLoadingStatus" runat="server" DynamicLayout="true">
    <ProgressTemplate>
        <div id="overlay">
            <div id="modalprogress">
                <div id="theprogress">
                    <asp:Image ID="imgWaitIcon" runat="server" ImageAlign="AbsMiddle" ImageUrl="/images/wait.gif" />
                    Please wait...
                </div>
            </div>
        </div>
    </ProgressTemplate>
</asp:UpdateProgress>

Вот CSS, если вам это нужно: 

#overlay {
    position: fixed;
    z-index: 99;
    top: 0px;
    left: 0px;
    background-color: #f8f8f8;
    width: 100%;
    height: 100%;
    filter: Alpha(Opacity=90);
    opacity: 0.9;
    -moz-opacity: 0.9;
}            
#theprogress {
    background-color: #fff;
    border:1px solid #ccc;
    padding:10px;
    width: 300px;
    height: 30px;
    line-height:30px;
    text-align: center;
    filter: Alpha(Opacity=100);
    opacity: 1;
    -moz-opacity: 1;
}
#modalprogress {
    position: absolute;
    top: 40%;
    left: 50%;
    margin: -11px 0 0 -150px;
    color: #990000;
    font-weight:bold;
    font-size:14px;
}
...