Discussion :

[TheReturnOfMuton]

Bonjour à tous,
Je suis dans l'incompréhension sur un tout petit souci de design sans gravité :
Au clic sur un bouton, je lance l'exécution d'un traitement long (plusieurs minutes parfois).
Pour faire patienter l'utilisateur, j'affiche d'abord un Panel (avec un ModalPopupExtender) contenant un gif animé + un message.
Mon pb est que ce gif animé n'est pas animé. Et ce sur Firefox ou IE.
Seule surprise : ce gif est animé sur Safari, sur un Mac.
Voici mon code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
 
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
 
    <asp:Button Style="display: none" ID="ModalButtonPopUpTraitement" runat="server" CausesValidation="False"/>
 
    <ajaxtoolkit:modalpopupextender ID="ModalPopupExtenderTraitement" runat="server" BackgroundCssClass="modalBackground"
        PopupControlID="PanelTraitement" TargetControlID="ModalButtonPopUpTraitement" />
 
    <asp:Panel ID="PanelTraitement" runat="server"  BackgroundCssClass="modalPopup"
        BackColor="#E0E3E7" BorderColor="GhostWhite" BorderWidth="3" 
        Height="81px" Width="359px" CssClass="modalPopup">
        <table width="100%">
            <tr>
                <td>
                    &nbsp;</td>
                <td align="center">
                    <table style="width: 320px">
                        <tr>
                            <td align="right">
                                <asp:Image ID="ImageProcess" runat="server" alt="Traitement en cours..." 
                                    ImageUrl="~/Images/process_running.gif" Width="70px" />
                            </td>
                            <td>
                                &nbsp;</td>
                            <td align="left">
                                <asp:Label ID="LabelTraitementEnCours" runat="server" 
                                    Text="Le traitement peut prendre plusieurs minutes, merci de patienter."></asp:Label>
                            </td>
                        </tr>
                    </table>
                </td>
                <td>
                    &nbsp;</td>
            </tr>
        </table>
    </asp:Panel>

Et voici comment j'appelle la popup depuis mon Page_Load :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
ImageButtonAction.OnClientClick = "if(confirm('Vous allez exécuter le traitement ; ce processus peut demander plusieurs minutes. Continuer ?')) { $find('" + ModalPopupExtenderTraitement.ClientID + "').show();}";

Merci d'avance pour votre aide.

[tomlev]

Si tu ouvres l'image toute seule dans le navigateur, elle est bien animée ?
Poste l'image ici

[TheReturnOfMuton]

Si tu ouvres l'image toute seule dans le navigateur, elle est bien animée ?
Poste l'image ici

Salut tomlev,
L'image tourne bien sur IE et FF, la voici :

[tomlev]

Bizarre... tu peux montrer le code HTML généré par ta page ? (juste la partie qui contient l'image)

[TheReturnOfMuton]

Voici la partie de la source qui nous intéresse :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
 
    <div id="ctl00_ContentPlaceHolderPagePrincipale_PanelTraitementRunning" class="modalPopup" BackgroundCssClass="modalPopup" style="background-color:#E0E3E7;border-color:GhostWhite;border-width:3px;border-style:solid;height:81px;width:359px;">
 
        <table width="100%">
            <tr>
                <td>
                    &nbsp;</td>
                <td align="center">
                    <table style="width: 320px">
                        <tr>
                            <td align="right">
                                <img id="ctl00_ContentPlaceHolderPagePrincipale_ImageProcess" alt="Traitement en cours..." src="Images/process_running.gif" style="width:70px;border-width:0px;" />
                            </td>
                            <td>
                                &nbsp;</td>
                            <td align="left">
                                <span id="ctl00_ContentPlaceHolderPagePrincipale_LabelTraitementEnCours">Le traitement peut prendre plusieurs minutes, merci de patienter.</span>
                                <span id="ctl00_ContentPlaceHolderPagePrincipale_LabelTraitementEchoue" style="color:Red;"></span>
                            </td>
                        </tr>
                    </table>
                </td>
                <td>
                    &nbsp;</td>
            </tr>
        </table>
 
</div>

[tomlev]

Bizarre, si je colle ce code dans une page HTML, ça tourne sans problème... c'est peut-être lié au fait que ce soit dans un popup

[TheReturnOfMuton]

Alors après plusieurs heures de tournage en rond, il se trouve que je n'avais pas la toute dernière version d'AjaxToolkit, et en plus il fallait encadrer mon panel et mon gif animé par un UpdatePanel.
Problème résolu, merci Tomlev.