[英]How to show upload percentage in asp.net
我在更新面板中上傳了一個異步文件,一旦選擇了文件,它就會上傳文件。 文件上傳時,我正在顯示更新進度。 在這里,我有一個圖像說處理。 上傳完成后,圖像消失。 除了顯示圖片外,我如何顯示上傳百分比。
<asp:UpdateProgress ID="UpdateProgress2" runat="server">
<ProgressTemplate>
<div>
<b>Please Wait...</b>
<img runat="server" id="ajaxLoader" style="background-color: White; width: 338px;"
src="styles/images/loadImage.gif" alt="loading" />
</div>
</ProgressTemplate>
</asp:UpdateProgress>
可以嘗試:
<head runat="server">
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
<script src="http://malsup.github.com/jquery.form.js"></script>
<script>
$(document).ready(function(){
var options = {
beforeSend: function () {
$("#progress").show();
//clear everything
$("#bar").width('0%');
$("#message").html("");
$("#percent").html("0%");
},
uploadProgress: function (event, position, total, percentComplete) {
$("#bar").width(percentComplete + '%');
$("#percent").html(percentComplete + '%');
},
success: function () {
$("#bar").width('100%');
$("#percent").html('100%');
},
complete: function (response) {
$("#message").html("<font color='green'>" + response.responseText + "</font>");
},
error: function () {
$("#message").html("<font color='red'> ERROR: unable to upload files</font>");
}
};
$("#form1").ajaxForm(options);
});
</script>
<body>
<form id="form1" action="AjaxUploadFile.aspx" method="post" enctype="multipart/form-data" runat="server">
<div>
<input type="file" size="60" name="myfile" />
<input type="submit" value="Ajax File Upload" />
<div id="progress">
<div id="bar"></div>
<div id="percent">0%</div >
</div>
<br/>
<div id="message"></div>
</div>
</form>
后面的代碼:
protected void Page_Load(object sender, EventArgs e)
{
HttpPostedFile file =null;
if (Request.Files.Count>0)
{
file = Request.Files[0];
file.SaveAs(Server.MapPath("~/UploadedFiles/")+file.FileName);
}
}
在這里不可能,您可以顯示動畫圖像,或者嘗試使用jQuery插件或uplodify 。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.