Bonjour, je travaille dans une fonctionnalité permettant de sélectionner plusieurs fichiers, une barre de chargement qui devrait s'afficher ensuite les fichiers ne se charge pas voici mon code
Webform.aspx

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
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
 
 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="ProgressBar.WebForm2" %>
 
                <!DOCTYPE html>
 
                <html xmlns="http://www.w3.org/1999/xhtml">
                <head runat="server">
                    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
                    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
                    <script src="http://malsup.github.com/jquery.form.js"></script>
                    <link href="jquery-ui.css" rel="stylesheet" />
                     <script type="text/javascript">
                         $(document).ready(function () {
                             //$(document).ready(function () {
                             $("#FileUpload1").change(function () {
                                 var files = $("#FileUpload1")[0].files;
                                 if (files.length > 0) {
                                     var formData = new FormData();
                                     for (var i = 0; i < files.length; i++) {
                                         formData.append(files[i].name, files[i]);
                                     }
 
                                     var progressbarLabel = $('#progressBar-label');
                                     var progressbarDiv = $('#progressbar');
 
                                     $.ajax({
                                         url: 'UploadHandler.ashx',
                                         type: 'post',
                                         data: formData,
 
                                         beforeSend: function () {
                                             status.fadeOut();
                                             progressbarDiv.width('0%');
                                             progressbarLabel.html('0%');
                                         },
 
                                         /* progress bar call back*/
                                         uploadProgress: function (event, position, total, percentComplete) {
                                             var pVel = percentComplete + '%';
                                             progressbarDiv.width(pVel);
                                             progressbarLabel.html(pVel);
                                         },
 
                                         success: function () {
                                             progressbarLabel.text('Terminé');
                                             progressbarDiv.fadeOut(2000);
                                         },
                                         error: function (err) {
                                             alert(err.statusText);
                                         }
                                     });
 
                                     progressbarLabel.text('Transfert...');
                                     progressbarDiv.progressbar({
                                         value: false
                                     }).fadeIn(500);
                                 }
                             });
                         });
                    </script>
                    <title></title>
                </head>
                <body style="font-family:Arial">
                    <form id="form1" runat="server">
                        Choisir les fichiers : <asp:FileUpload ID="FileUpload1" AllowMultiple="true" runat="server" />
                        <br /><br />
                        <div class="status"  style="width:300px">
                            <div id="progressbar" style="position:relative; display:none">
                                <span id="progressbar-label" style="position:absolute; left:35%; top:20%">Chargement...</span>
                            </div>
                        </div>
                    </form>
                </body>
                </html>
UploadHandler.ashx

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
public class UploadHandler : IHttpHandler
{
 
    public void ProcessRequest(HttpContext context)
    {
        if (context.Request.Files.Count > 0)
        {
            HttpFileCollection files = context.Request.Files;
            for (int i = 0; i < files.Count; i++)
            {
                System.Threading.Thread.Sleep(1000);
                HttpPostedFile file = files[i];
                string fileName = context.Server.MapPath("~/Uploads/" + System.IO.Path.GetFileName( file.FileName));
                file.SaveAs(fileName);
            }
        }
    }
 
    public bool IsReusable
    {
        get
        {
            return false;
        }
    }
}
Je précise que le code c# ne contient aucun problème, le problème réside dans le code jquery, j'aimerai dès que la sélection des fichiers soit faite une barre de chargement apparait
Merci d'avance.