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方面做什麼。