Обновление панели анимации не отображается - PullRequest
0 голосов
/ 16 июня 2009

Не получается получить панель обновлений с анимированным GIF-файлом, появляющуюся при следовании простому «рецепту» в популярном блоге.

Мы используем ASP.NET 3.5 с VB-кодами страниц (немного AJAX, но ничего сложного). Пользователям предоставляется «страница выбора», содержащая данные, которые они могут редактировать. На странице есть несколько флажков и раскрывающихся списков вверху, которые используются в качестве фильтров для вида сетки справа внизу. Щелчок по соответствующей ссылке на указанном ряду перенаправляет вас на страницу сведений об этом элементе.

Флажки при срабатывании заставляют другую поездку в базу данных захватывать список объектов, к которым привязана сетка данных (указывая, какие классы объектов должны быть считаны из базы данных). Раскрывающиеся списки используются для «фильтрации» дисплея. Эти фильтры работают очень быстро - нет проблем. Однако некоторые поездки в базу данных вызывают много исторических данных, и для повторного отображения страницы требуется некоторое время. Мы хотели, чтобы что-то на экране сообщало пользователю, что программное обеспечение работает.

Мы решили попробовать методологию здесь, в блоге Мэтта Берсета

К сожалению, я, должно быть, делаю что-то не так, поскольку у меня нет всплывающей панели анимации.

Первое отличие в том, что у рассматриваемой страницы есть главная страница - я не знаю, критично ли это. Но вот фрагменты aspx после тегов asp: Content и asp: ScriptManager:

Сначала у меня есть функции onUpdating и onUpdate, как в примере на странице, на которую есть ссылки, измененные только для соответствия имени моего GridView.

Затем начинается начало элемента div, который начинается с таблицы, в которой установлены флажки и раскрывающиеся списки.

Пример их определения приведен ниже:

    <asp:TableCell ID="TableCell4" runat="server"><asp:CheckBox ID="chkShowCancelled" runat="server" Text="Cancelled" AutoPostBack="True" /></asp:TableCell>
    <asp:TableCell>TO#:<asp:DropDownList ID="ddlTO" runat="server" AutoPostBack="True"></asp:DropDownList></asp:TableCell>

После этого есть панель обновления с видом сетки:

<asp:UpdatePanel ID="updatePanel" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        <asp:GridView ID="grdRequests" runat="server" Style="z-index: 100; left: 0px; top: 0px" 
            AutoGenerateColumns="False" CellPadding="4" Font-Size="Small" ForeColor="#333333" 
            GridLines="None" PageSize="25" AutoGenerateSelectButton="False" AllowSorting="True" Width="100%" EnableViewState="False">
            <HeaderStyle CssClass="tableheader" />
            <FooterStyle BackColor="#000099" Font-Bold="True" ForeColor="White" />
            <RowStyle BackColor="#EFF3FB" />
            <Columns>
                 ...Template Fields Deleted for Brevity...
            </Columns>
            <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
            <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
            <HeaderStyle BackColor="#034EA1" Font-Bold="True" ForeColor="White" />
            <EditRowStyle BackColor="#2461BF" />
            <AlternatingRowStyle BackColor="White" />
        </asp:GridView>
    </ContentTemplate> </asp:UpdatePanel>

Сразу после этого AnimationExtender и всплывающая панель

<cc1:UpdatePanelAnimationExtender runat="server" TargetControlID="updatePanel">
    <Animations>
        <OnUpdating>
            <Parallel duration="0">
                <ScriptAction Script="onUpdating();" />
            </Parallel>
        </OnUpdating>
        <OnUpdated>
            <Parallel duration="0">
                <ScriptAction Script="onUpdated();" />
            </Parallel>
        </OnUpdated>
    </Animations>
</cc1:UpdatePanelAnimationExtender>
<asp:Panel ID="pnlPopup" runat="server" CssClass="progress" style="display:none;">
    <div class="pcontainer">
        <div class="pheader">Loading, please wait...</div>
        <div class="pbody">
            <img alt="Progressing..." src="~/Images/activity.gif" />
        </div>
    </div>
</asp:Panel> 

Тогда просто конечный тег для div-элемента 'wrapping' непосредственно перед таблицей.

В примерах Мэтт просто переводит страницу в спящий режим с помощью оператора System.Threading.Thread.Sleep (3000) в своем Page.Load (после проверки IsPostback), чтобы анимация всплывала и отображалась. У меня много чего происходит в Page.Load (код в VB), но анимация просто НЕ запускается, когда я нажимаю на один из флажков (чтобы совершить долгое путешествие в базу данных) или выбираю что-то из выпадающего списка. вниз список (чтобы отфильтровать результаты, которые у меня уже есть).

Если это имеет значение, то div для упаковки, который имеет Table, GridView, UpdatePanel, UpdatePanelAnimationExtender, определяется без свойств. Это было действительно только для того, чтобы разграничить Javascript от тегов asp.

Что мне не хватает?

1 Ответ

1 голос
/ 16 июня 2009

Хорошо, я использовал AJAX control toolkit 1.0 с .net 2.0, и моя панель обновлений работает отлично.

Во-первых, где ваш код JavaScript?

РЕДАКТИРОВАТЬ: Вот мой код, который работает:

                                <ContentTemplate>
                                     <asp:UpdateProgress id="tab1Updating" runat="server" AssociatedUpdatePanelID="tab1Update">
                                                    <ProgressTemplate>
                                                        <div>
                                                            <img src="./IMG/loader.gif" alt="loading" /> 
                                                               Please Wait...
                                                        </div>
                                                    </ProgressTemplate>
                                     </asp:UpdateProgress>
                             </ContentTemplate>
                             </asp:UpdatePanel>

                         </ContentTemplate>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...