爪哇一角

共同探讨STRUTS#HIBERNATE#SPRING#EJB等技术
posts - 3, comments - 6, trackbacks - 0, articles - 99
  BlogJava :: 首页 :: 新随笔 :: 联系 :: 聚合  :: 管理

easyui-progressbar实例!

Posted on 2016-03-23 15:05 非洲小白脸 阅读(544) 评论(0)  编辑  收藏 所属分类: AJAX + jQuery
jsp:<div id="p" class="easyui-progressbar" style="width:400px;"></div>

js:
var timerId;
// 初始化方法
function init(){
//每隔0.5秒自动调用方法,实现进度条的实时更新
timerId=window.setInterval(getProgress,500);
$.ajax({
   dataType: "json",
   method: "post",
   url: contextPath+"/XXXX/clearProgress.do"
})
$("#p").show();
$('#p').window({
title:'进度条',
width:420,
height:50,
modal:true,
minimizable:false,
maximizable: false,
closed: false,
collapsible:false
});
};
function getProgress()
{
$.ajax({
   dataType: "json",
   method: "post",
   url: contextPath+"/XXX/getProgress.do"
}).done(function(data){
if(data.processInt>=100){
            window.clearInterval(timerId);
            $('#p').window('close');
         }
         $('#p').progressbar('setValue',data.processInt);
    }).fail(function(){
    $.messager.alert('告警',"本次操作失败,请重新操作",'error');
return false;
    });
}

java:
int processInt = 0;
    /**
     * 
     * ??
     * @author 
     * @param 
     * @param 
     * @return
     * @see [类、类#方法、类#成员]
     */
    @RequestMapping(value = "/clearProgress", method = RequestMethod.POST)
    public @ResponseBody void clearProgress()
    {
        processInt = 0;
    }
    /**
     * 
     * ??
     * @author 
     * @param 
     * @param 
     * @return
     * @see [类、类#方法、类#成员]
     */
    @RequestMapping(value = "/getProgress", method = RequestMethod.POST)
    public @ResponseBody Map<String, Object> getProgress()
    {
        Map<String, Object> map = new HashMap<String, Object>();
        try
        {
            Random random=new Random();
            processInt += random.nextInt(10);
        }
        catch (Exception e)
        {
            log.error("Exception:", e);
        }
        map.put("processInt", processInt);
        return map;
    }

实际项目中,只要将后台处理的过程的进度实时传递给公共变量processInt 即可。

只有注册用户登录后才能发表评论。


网站导航: