Apache Tapestry - Ajax 元件

AJAX 含義為非同步 JavaScript 和 XML。它是藉助XML、JSON、HTML、CSS和JavaScript建立效能更優、更快速、更具互動性的 Web 應用程式的一種技術。AJAX 允許您非同步傳送和接收資料，而無需重新載入網頁，因此速度很快。

區域元件

區域元件用於提供內容（標記）以及內容本身的位置。區域元件的主體在 Tapestry 中用於內部生成內容。動態內容生成後，Tapestry 會將其傳送給客戶端，在正確的位置重新呈現資料，觸發並動態顯示 HTML，以引起使用者的注意。

此區域元件與 EventLink 元件一起使用。EventLink 具有選項，可以使用t:zone屬性與特定區域關聯。在 EventLink 中配置區域後，單擊 EventLink 將觸發區域更新。此外，EventLink 事件 (refreshZone) 可用於控制動態資料的生成。

下面是一個簡單的 AJAX 示例：

AjaxZone.tml

<html t:type = "Newlayout" title = "About MyFirstApplication" 
   xmlns:t = "http://tapestry.apache.org/schema/tapestry_5_4.xsd" 
   xmlns:p = "tapestry:parameter">  
   
   <body> 
      <h1>Ajax time zone example</h1>  
      <div class = "div1">  
         <a t:type = "eventlink" t:event = "refreshZone" href = "#" 
            t:zone = "timeZone">Ajax Link </a><br/><br/> 
         <t:zone t:id = "timeZone" id = "timeZone">Time zone: ${serverTime}</t:zone> 
      </div>  
   </body>
   
</html>

AjaxZone.java

package com.example.MyFirstApplication.pages;  

import java.util.Date; 
import org.apache.tapestry5.annotations.InjectComponent; 
import org.apache.tapestry5.corelib.components.Zone; 
import org.apache.tapestry5.ioc.annotations.Inject; 
import org.apache.tapestry5.services.Request;  

public class AjaxZone { 
   @Inject 
   private Request request; 
   
   @InjectComponent 
   private Zone timeZone; 
   
   void onRefreshPage() { 
   } 
   
   Object onRefreshZone() { 
      return request.isXHR() ? timeZone.getBody() : null; 
   } 
   
   public Date getServerTime() { 
      return new Date(); 
   } 
}

結果將顯示在此處：https://:8080/MyFirstApplication/AjaxZone

列印頁面

上一個

下一個