ASP.NET AJAX 进度条：从后面的代码更新？答案

【问题标题】：ASP.NET AJAX Progress Bar: Update from Code Behind?ASP.NET AJAX 进度条：从后面的代码更新？
【发布时间】：2010-10-22 08:16:46
【问题描述】：

我在应用程序中有一个 Excel 电子表格的导入功能。它现在使用 FileUpload 控件。我上传文件，然后对该文件运行操作。我想通知用户正在完成的操作以及完成的百分比。我认为我可以获取从 Excel 电子表格中提取的总行数，并在我将每条记录插入数据库并更新进度条时不断划分。

问题是我似乎找不到任何可以从 Code Behind 更新进度条的解决方案。我尝试使用Matt Berseth's solution。

看起来很漂亮，但我看不出它可以从背后的代码中运行。从理论上讲，我认为将值放入页面上的文本框中，并将 onchange 设置为 JavaScript 函数以设置百分比可以作为测试，但即使这样也没有给我想要的结果。

关于如何做到这一点的任何建议？

【问题讨论】：

标签： asp.net .net asp.net-ajax progress-bar

【解决方案1】：

您应该知道的是，您无法使用标准 FileUpload 控件检查文件上传的状态。您可以做的是在服务器上上传文件，然后使用 ODBC 连接到它，并开始异步读取和插入数据库中的行（通过向页面发出 ajax 请求或使用脚本服务）。

就进度条而言，您应该简单地使用 CSS 进度条（您可以在 http://css-tricks.com/examples/ProgressBars/ 找到一个简单的示例）。

然后，您应该使用可以从服务器返回进度状态的方法构建脚本服务（使用 Web 服务）：

您的 *.asmx 文件应包含以下内容：

[WebMethod]
public int GetStatus()
    {
        int progress = 0; // in percents
        // your server-side code here
        return progress;
    }

您的 aspx 页面应包含以下内容：

<asp:ScriptManager runat="server" ID="ScriptManager">
 <Services>
    <asp:ServiceReference Path="~/services/import.asmx" InlineScript="false" />
 </Services>
</asp:ScriptManager>

然后，您应该能够定期从 JavaScript 调用该方法（例如，每秒使用 setTimeout）并使用简单的 JavaScript 或 jQuery 更新进度条宽度：

var tout, service;

function UpdateStatus() {
    if (tout != null)
         clearTimeout(tout);

    if (service == null)
         service = new namespace.here.serice_class_here();

    service.GetStatus(onSuccess, onFailure);    
}

function onSuccess(result) {
    // update the width of the progress with result (the integer value of the progress)
    progress_bar.style.width = percent + "%";        

    // call the method again
    tout = setTimeout("UpdateStatus()", 1000);
}

function onFailure(error) {
    alert(error.get_message());
}

您可以扩展 onSuccess JavaScript 函数，当进度完成时（返回值为 100%），您可以根据需要将用户重定向到另一个页面或显示信息或按钮。

我希望这会有所帮助！

【讨论】：