加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 编程开发 > asp.Net > 正文

ASP.NET AJAX进度条:从代码背后更新?

发布时间:2020-12-16 07:42:48 所属栏目:asp.Net 来源:网络整理
导读:我在应用程序中有一个Excel电子表格的导入功能.它目前使用FileUpload控件.我上传文件,然后对该文件运行操作.我想告诉用户正在进行的操作以及完成的百分比.我想我可以获取从Excel电子表格中提取的总行数,并在将每条记录插入数据库并更新进度条时不断划分. 问
我在应用程序中有一个Excel电子表格的导入功能.它目前使用FileUpload控件.我上传文件,然后对该文件运行操作.我想告诉用户正在进行的操作以及完成的百分比.我想我可以获取从Excel电子表格中提取的总行数,并在将每条记录插入数据库并更新进度条时不断划分.

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

看起来非常好看,但是我无法看到Code Behind的工作原理.从理论上讲,我认为将值放入页面上的文本框中,并将onchange设置为JavaScript函数来设置百分比将作为测试,但即使这样也没有给我预期的结果.

有关如何做到这一点的任何建议?

解决方法

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

就进度条而言,你应该只使用一个CSS progres栏(你可以在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%),您可以根据需要将用户重定向到另一个页面或显示信息或按钮.

我希望这有帮助!

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读