Ajax Tag trong Struts 2

Struts sử dụng DOJO Framework để triển khai AJAX tag. Bạn cần thêm struts2-dojo-plugin-2.2.3.jar tới classpath. Bạn có thể lấy file này từ lib folder của struts 2 đã tải về (C:\struts-2.2.3-all\struts-2.2.3\lib\struts2-dojo-plugin-2.2.3.jar)

Chúng ta sửa đổi HelloWorld.jsp như sau:

<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sx" uri="/struts-dojo-tags"%>
<html>
<head>
<title>Hello World</title>
<s:head />
<sx:head />
</head>
<body>
   <s:form>
      <sx:autocompleter label="Favourite Colour"
         list="{'red','green','blue'}" />
      <br />
      <sx:datetimepicker name="deliverydate" label="Delivery Date"
         displayFormat="dd/MM/yyyy" />
      <br />
      <s:url id="url" value="/hello.action" />
      <sx:div href="%{#url}" delay="2000">
           Initial Content
      </sx:div>
      <br/>
      <sx:tabbedpanel id="tabContainer">
         <sx:div label="Tab 1">Tab 1</sx:div>
         <sx:div label="Tab 2">Tab 2</sx:div>
      </sx:tabbedpanel>
   </s:form>
</body>
</html>

Quảng cáo

Sau đây chúng ta phân tích ví dụ trên:

Trong dòng code thứ hai, bạn chú ý rằng chúng ta đã thêm một thư viện thẻ taglib mới với tiền tố là sx. Đây là thư viện thẻ đặc biệt được tạo để tích hợp ajax.

Tiếp đó, bên trong HTML head, chúng ta gọi sx:head. Nó khởi tạo DOJO Framework và làm cho nó sẵn sàng cho tất cả lời gọi AJAX bên trong page. Bước này là rất quan trọng, các lời gọi AJAX của bạn sẽ không làm việc nếu không khởi tạo sx:head.

Thẻ autocompleter trông khá giống một select box. Nhưng điểm khác nhau giữa thẻ này và select box là nó tự động hoàn thành. Tức là, nếu bạn gõ gr, nó sẽ tự động điền là green. Ngoài ra thẻ này còn khá giống thẻ s:select.

Thẻ datetimepicker tạo một trường input với một button. Khi nút này được nhấn, một popup được hiển thị. Khi người dùng lựa chọn một date, thì date được điền vào trong trường input trong định dạng mà đã được xác định trong thuộc tính thẻ. Trong ví dụ, chúng ta đã định dạng là dd/MM/yyyy.

Tiếp đó, chúng ta tạo thẻ url tới system.action file mà chúng ta đã tạo trong các chương trước. Khi chúng ta xác định một sx:div với delay được thiết lập là 2 s thì khi bạn chạy, thì Initial Content sẽ được hiển thị trong 2 s, sau đó nội dung của div sẽ được thay thế với nội dung từ hello.action.

Cuối cùng, chúng ta có thẻ sx:tabbedpanel với hai tab.

Đã có app VietJack trên điện thoại, giải bài tập SGK, SBT Soạn văn, Văn mẫu, Thi online, Bài giảng....miễn phí. Tải ngay ứng dụng trên Android và iOS.

Theo dõi chúng tôi miễn phí trên mạng xã hội facebook và youtube:

Follow fanpage của team https://www.facebook.com/vietjackteam/ hoặc facebook cá nhân Nguyễn Thanh Tuyền https://www.facebook.com/tuyen.vietjack để tiếp tục theo dõi các loạt bài mới nhất về Java,C,C++,Javascript,HTML,Python,Database,Mobile.... mới nhất của chúng tôi.

Các bài học Struts 2 phổ biến khác tại VietJack:

Trang trước

Trang sau

Quảng cáo

Ajax Tag trong Struts 2

Chính sách

Liên hệ với chúng tôi