显示多个操作的 asp.net 进度条答案

【问题标题】：show asp.net progress bar for multiple operations显示多个操作的 asp.net 进度条
【发布时间】：2014-06-02 08:05:12
【问题描述】：

我需要在网页上显示三个操作的 asp.net 进度条。首先，当文件上传进度条应该显示 33 % 和消息'文件上传开始'。上传后应显示消息“验证文件数据”，进度为 66%。在第三轮，它应该显示 99% 的“自动化数据”。

我有三个方法会被一一调用。我用谷歌搜索了很多，但找不到此类问题的解决方案。有人可以帮忙吗？

【问题讨论】：

这个问题太笼统了。您需要自己尝试解决方案，如果您的代码遇到问题，请在此处回复。
有些解决方案必须自己找到并修复 - 并非所有内容都在 google 搜索结果中免费提供。
先生，我尝试了代码。我在按钮点击事件中调用了三个方法。在每个方法中，我使用循环来更改标签文本。当一个方法执行时，标签应该显示'文件上传' 与其他两种方法相同。但是标签中的文字没有改变。请帮忙。
没有任何代码几乎不可能提供帮助。编辑您的问题，添加相关代码（强调相关），也许有人可以帮助您。

标签： c# asp.net file-upload progress-bar

【解决方案1】：

如果要显示进度条，则需要引入一些 java 脚本或 jquery 代码。我正在分享一个示例代码，您可以从这里获得灵感

<form id="form1" runat="server">
    <div style="text-align: left">
        <asp:FileUpload ID="FileUpload1" runat="server" />&nbsp;<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

【讨论】：