JSP/Liferay的Jquery进度条实现

Question

我对JSP/Liferay portlet的开发很陌生，我试图用jQuery添加一个进度条，发现this question，但并不是非常具体，它将如何完成使用AJAX。

我想知道是否有人能指出我在正确的方向，以帮助我上手。

谢谢。

编辑：

我用JSON simple和管理做出一些改变，但我（用火的错误时，错误代码400）得到一个坏的请求和404对我的JS没有找到

下面

是我的代码：这里

function checkStatus(){ 
    $.ajax({ 
      type: 'POST', 
      //url: '<%=request.getContextPath()%>/checkStatusServlet', 
      url: '<%=request.getContextPath()%>/generateJSON', 
      dataType: 'json', 
      success: function(data) 
      { 
      alert(data.statusPercent); 
      var statusPercent = data.percent; 
      //Update your jQuery progress bar 
      $("#progressbar").progressbar({value: statusPercent}); 

      } 
    }); 
    //below works and alert is being called... 
    /*for (i=0;i<=5;i++) 
    { 
     $("#progressbar").progressbar({value: i+10}); 
    } 
    alert('got here'); 
    */ 
} 

public void processAction(
     ActionRequest actionRequest, ActionResponse actionResponse) 
    throws IOException, PortletException { 

//some code here 


    this.generateJSON(actionRequest, actionResponse);//manual call the method? 

public void generateJSON(ActionRequest actionRequest, ActionResponse actionResponse) 
    throws IOException, PortletException { 
     try{ 
         //just want to see a progress bar so do static for now... 
      JSONObject obj=new JSONObject(); 
      obj.put("percent",new Integer(30)); 
      StringWriter out = new StringWriter(); 
      obj.writeJSONString(out); 
      String jsonText = out.toString(); 
     }catch(Exception ex){ 
      System.out.print(ex); 
     } 
     } 
    }//end of class 

JS HTML/JSP

<%@ page import="javax.portlet.PortletPreferences" %> 
<portlet:defineObjects/> 
<portlet:renderURL var="resourceUrl"></portlet:renderURL> 
<!-- Javascript files --> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.js"></script> 
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> 
<script type="text/javascript" src="js/main.js"></script> 
<!-- end of Java script files --> 
<script type="text/javascript"> 
    setTimeout('checkStatus()',1000); 
</script> 
<div id="progressbar"></div> 

Answer 1

答案真的取决于您的具体需求。您是否试图显示某个任务实际剩下多少时间，或者直到页面加载或多少时间？

你可以从客户端查询，并根据上还剩多少处理在浏览器更新进度条。一个简单的jQuery AJAX例如：

function checkStatus 
{ 
    $.ajax({ 
      type: 'POST', 
      url: '<%=request.getContextPath()%>/checkStatusServlet', 
      dataType: 'json', 
      success: function(data) 
      { 
      var statusPercent = data.statusPercent; 

      //Update your jQuery progress bar 
      $("#progressbar").progressbar({value: statusPercent }); 
      } 
    }); 
} 

然后，您只需查询该功能，直到它完成

setTimeout('checkStatus()' 1000); 

当然，你还需要构建一个servlet或Struts动作或portlet处理的处理服务器，并返回适当的任务状态。

编辑：

使用JSON library 从你的servlet或动作。 （以下代码来自struts2操作）

Answer 2

您无法在processAction中生成JSON。此方法旨在更改portlet状态，但不会生成输出。使用serveResource方法/生命周期阶段完成所需内容的门户方式：您从门户网站（< portlet：resourceURL />）获取此URL。具体来说，你不应该自己创建它们。

的替代（而不是门户的方式）是使用一个servlet - 但在这你没有，你可能需要Portlet的状态。

而且您可能希望使用< portlet：namespace />来消除您的全局名称的歧义 - 或者使用正确的名称空间 - 因为您永远无法说出您的portlet将放置在页面上的次数。

（加空格的JSP标签，让他们不要被标记吃掉）

短：阅读资源服务的门户，这将最有可能解决你的根本问题：随着你的代码给在上面你根本无法访问你的JSON--不管你在JS方面做什么。