Tapisserie Apache - Composant Ajax

AJAX signifie Asynchronous JavaScript and XML. C'est une technique pour créer des applications Web meilleures, plus rapides et plus interactives à l'aide deXML, JSON, HTML, CSS, et JavaScript. AJAX vous permet d'envoyer et de recevoir des données de manière asynchrone sans recharger la page Web, donc c'est rapide.

Composant de zone

Un composant de zone est utilisé pour fournir le contenu (balisage) ainsi que la position du contenu lui-même. Le corps du composant de zone est utilisé en interne par Tapestry pour générer le contenu. Une fois le contenu dynamique généré, Tapestry l'enverra au client, restituera les données au bon endroit, déclenchera et animera le HTML pour attirer l'attention de l'utilisateur.

Ce composant Zone est utilisé avec un composant EventLink. Un EventLink a la possibilité de le lier à une zone particulière en utilisant let:zoneles attributs. Une fois la zone configurée dans EventLink, cliquer sur EventLink déclenchera la mise à jour de la zone. De plus, les événements EventLink (refreshZone) peuvent être utilisés pour contrôler la génération de données dynamiques.

Un exemple simple d'AJAX est le suivant -

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(); 
   } 
}

Le résultat s'affichera sur: http: // localhost: 8080 / MyFirstApplication / AjaxZone