前端如何实现后端运行进度_前端实时更新后端处理进度之 进度条实现

情景需求

在做图形提交界面时,点击提交按钮后,系统需要较长时间做处理,前端需要动态显示处理进度,并在完成后显示处理结果

实现逻辑

1.点击按钮后向后台发送数据处理请求2.后台处理数据3.前端获取后端处理进度并更新进度条

环境介绍

1.前端:html + Jquery + bootstrap2.后端:Django

功能实现

前端

html

网页页面使用bootstrap的进度条,进度条由2个div嵌套而成,通过修改内层div的width实现显示并更新进度,在此我们给进度条设置一个id:mbprocess,以便根据进度更改其显示状态

给用来提交表单的form设置一个ID,用来绑定form表单提交时的函数

form中提交表单的button绑定checkmbfw()函数用来检测提交信息是否符合要求

# 标准FW 勾选升级

全选

测试结果

BMC { { skuinfofw.bmcfw }}

升级

...

.

你可能感兴趣的:(前端如何实现后端运行进度)