Apache Tapestry - Ajax Component
AJAX là viết tắt của Asynchronous JavaScript and XML. Đây là một kỹ thuật để tạo các ứng dụng web tốt hơn, nhanh hơn và tương tác hơn với sự trợ giúp củaXML, JSON, HTML, CSS, và JavaScript. AJAX cho phép bạn gửi và nhận dữ liệu không đồng bộ mà không cần tải lại trang web nên rất nhanh.
Thành phần vùng
Thành phần Vùng được sử dụng để cung cấp nội dung (đánh dấu) cũng như vị trí của chính nội dung đó. Phần thân của Zone Component được Tapestry sử dụng nội bộ để tạo nội dung. Khi nội dung động được tạo, Tapestry sẽ gửi nội dung đó đến máy khách, hiển thị dữ liệu ở đúng vị trí, kích hoạt và tạo hoạt ảnh cho HTML để thu hút sự chú ý của người dùng.
Thành phần Zone này được sử dụng cùng với một thành phần EventLink. EventLink có tùy chọn để liên kết nó với một vùng cụ thể bằng cách sử dụngt:zonethuộc tính. Sau khi vùng được định cấu hình trong EventLink, việc nhấp vào EventLink sẽ kích hoạt cập nhật vùng. Ngoài ra, các sự kiện EventLink (refreshZone) có thể được sử dụng để kiểm soát việc tạo dữ liệu động.
Một ví dụ đơn giản về AJAX như sau:
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();
}
}Kết quả sẽ hiển thị tại: http: // localhost: 8080 / MyFirstApplication / AjaxZone
