c# - asp net multiple file upload with progress bar -
hi working in code should allow select multiple fileupload , when uploading files should show progress bar percentage of loading
here code
webform.aspx
<%@ 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(); (var = 0; < 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
public class uploadhandler : ihttphandler { public void processrequest(httpcontext context) { if (context.request.files.count > 0) { httpfilecollection files = context.request.files; (int = 0; < 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 { { return false; } } }
it's not working, progress bar doesn't appear , files not stored on uploads directory
Comments
Post a Comment