Apache Tapestry - ส่วนประกอบ Ajax
AJAX ย่อมาจาก Asynchronous JavaScript and XML. เป็นเทคนิคในการสร้างเว็บแอปพลิเคชันที่ดีขึ้นเร็วขึ้นและโต้ตอบได้มากขึ้นด้วยความช่วยเหลือของXML, JSON, HTML, CSS, และ JavaScript. 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();
}
}ผลลัพธ์จะแสดงที่: http: // localhost: 8080 / MyFirstApplication / AjaxZone
