Apache Tapisserie - Ajax-Komponente
AJAX steht für Asynchronous JavaScript and XML. Es ist eine Technik zum Erstellen besserer, schnellerer und interaktiverer Webanwendungen mit Hilfe vonXML, JSON, HTML, CSS, und JavaScript. Mit AJAX können Sie Daten asynchron senden und empfangen, ohne die Webseite neu laden zu müssen, sodass dies schnell geht.
Zonenkomponente
Eine Zonenkomponente wird verwendet, um den Inhalt (Markup) sowie die Position des Inhalts selbst bereitzustellen. Der Hauptteil der Zonenkomponente wird intern von Tapestry verwendet, um den Inhalt zu generieren. Sobald der dynamische Inhalt generiert wurde, sendet Tapestry ihn an den Client, rendert die Daten an der richtigen Stelle erneut, löst den HTML-Code aus und animiert ihn, um die Aufmerksamkeit des Benutzers auf sich zu ziehen.
Diese Zonenkomponente wird zusammen mit einer EventLink-Komponente verwendet. Ein EventLink hat die Option, ihn mit dem an eine bestimmte Zone zu bindent:zoneAttribute. Sobald die Zone in EventLink konfiguriert ist, wird durch Klicken auf EventLink die Zonenaktualisierung ausgelöst. Darüber hinaus können die EventLink-Ereignisse (refreshZone) verwendet werden, um die Generierung dynamischer Daten zu steuern.
Ein einfaches Beispiel für AJAX lautet wie folgt:
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();
}
}
Das Ergebnis wird angezeigt unter: http: // localhost: 8080 / MyFirstApplication / AjaxZone