我需要在网页上显示三个操作的asp.net进度条。首先,当文件上传时,进度条应显示33%并且消息'文件上传已启动'。上传后,它应显示消息“验证文件数据”并进度66%。在第三轮,它应显示99%的“自动匹配数据”。
我有三个方法将被逐个调用。我搜索了很多,但无法找到解决此类问题的方法。有人可以帮忙吗?
答案 0 :(得分:0)
如果要显示进度条,则需要引入一些java脚本或jquery代码。我正在分享您可以从这里获取想法的示例代码
<form id="form1" runat="server">
<div style="text-align: left">
<asp:FileUpload ID="FileUpload1" runat="server" /> <br />
<br />
<asp:Button ID="Button1" runat="server" Text="Upload" OnClientClick="return ProgressBar()" OnClick="Button1_Click" /><br />
<br />
<div id="divUpload" style="display: none">
<div style="width: 300pt; text-align: center;">Uploading...</div>
<div style="width: 300pt; height: 20px; border: solid 1pt gray">
<div id="divProgress" runat="server" style="width: 1pt; height: 20px; background-color: Gray; display: none">
</div>
</div>
<div style="width: 300pt; text-align: center;">
<asp:Label ID="lblPercentage" runat="server" Text="Label"></asp:Label>
</div>
</div>
</div>
<br />
<asp:Label ID="Label1" runat="server" ForeColor="Red" Text=""></asp:Label>
</form>
<script language="javascript" type="text/javascript">
var size = 2;
var id = 0;
function ProgressBar() {
if (document.getElementById('<%=FileUpload1.ClientID %>').value != "") {
document.getElementById("divProgress").style.display = "block";
document.getElementById("divUpload").style.display = "block";
id = setInterval("progress()", 20);
return true;
}
else {
alert("Select a file to upload");
return false;
}
}
function progress() {
size = size + 1;
if (size > 299) {
clearTimeout(id);
}
document.getElementById("divProgress").style.width = size + "pt";
document.getElementById("<%=lblPercentage.ClientID %>").
firstChild.data = parseInt(size / 3) + "%";
}
</script>
protected void Button1_Click(object sender, EventArgs e)
{
// Do code here to saving a file from fileupload control
//FileUpload1.PostedFile.SaveAs("path");
System.Threading.Thread.Sleep(8000);
Label1.Text = "Upload successfull!";
}
以下是源网址 - http://www.codeproject.com/Articles/26668/Showing-progress-bar-while-uploading-a-file-in-an