Bộ sưu tập

Giới thiệu về JSP Custom Tag


https://codersontrang.com/2013/02/24/gioi-thie%cc%a3u-ve-jsp-custom-tag/

Trong quá trình viết một web page, để ý sẽ thấy có những thành phần được lặp đi lặp lại rất nhiều lần mà trong đó chỉ khác nhau về giá trị của một tham số. Mỗi một thành phần như vậy có thể được khai báo thành các thẻ, với các tham số truyền vào là các thuộc tính của thẻ đó. Mỗi thẻ như vậy được gọi là một custom tag. Việc sử dụng custom tag sẽ rút ngắn được khối lượng code trong trang jsp và cho phép các thành phần này có thể sử dụng lại sau này. Bài viết này sẽ hướng dẫn các bạn cách để tạo ra một custom tag đơn giản.

Custom tag trong ví dụ của chúng ta sẽ đơn giản là một tag cho phép ta chỉ ra một đoạn text và màu của đoạn text đó, rồi in đoạn text đó ra trên trang web với màu sắc tương ứng.

Tạo một Dynamic Web Project trong Eclipse IDE có file index.jsp như hình dưới đây:

codersontrang_JSP_CustomTag_1

Bình thường, để tạo ra một đoạn text có màu, nội dung của file index.jsp sẽ như sau:

index.jsp

 
   
   
   
   
   
 JSP Custom Tag Demo  
   
   
      JSP Custom Tag Demo at Coder Son Trang  
   
   

Tạo một lớp ColorTextParser có nhiệm vụ sinh mã HTML tương ứng với custom tag của chúng ta như sau:

ColorTextParser.java


 package codersontrang.customtag;  

 import java.io.IOException;  
 import javax.servlet.jsp.JspException;  
 import javax.servlet.jsp.JspWriter;  
 import javax.servlet.jsp.tagext.TagSupport;  

 public class ColorTextParser extends TagSupport{  
      private String content;  
      private String color;  

      @Override  
      public int doStartTag() throws JspException {  
           try{  
                JspWriter out = pageContext.getOut();  

                StringBuffer tagGen = new StringBuffer();  
                tagGen.append("");  
                tagGen.append(content);  
                tagGen.append("");  

                out.print(tagGen.toString());  
           }catch(Exception e){  
                e.printStackTrace();  
           }  
           return SKIP_BODY;  
      }  

      public String getContent() {  
           return content;  
      }  
      public void setContent(String content) {  
           this.content = content;  
      }  
      public String getColor() {  
           return color;  
      }  
      public void setColor(String color) {  
           this.color = color;  
      }  
 }  

Tạo một file widget.tld là nơi chứa mô tả cho các custom tag như tên của tag, các thuộc tính của tag …

widget.tld


   

   
      1.0  
      1.1  
      colortext  
      Sample custom tag  
      https://codersontrang.wordpress.com/customtag  

        
        ColorText  
        codersontrang.customtag.ColorTextParser  
        Color a paragraph  
        
          
         content  
         true  
          
        
          
         color  
         true  
          
        

    

Bây giờ tag mà ta vừa tạo có thể được đưa vào sử dụng trong file jsp, ta thay đổi nội dung của file index.jsp như sau:

index.jsp


   
   
   
   
   
   
 JSP Custom Tag Demo  
   
   
        
   
   

Nhìn lại cấu trúc project của chúng ta sẽ như sau:

codersontrang_JSP_CustomTag_2

Và khi chạy trên web server ta sẽ được kết quả như sau:

codersontrang_JSP_CustomTag_3

Trên đây chỉ là một ví dụ nho nhỏ về việc sử dụng custom tag trong JSP, trên thực tế, custom tag sẽ được sử dụng để thay thế cho các thành phần có cấu trúc phức tạp hơn nhiều ví dụ như menu, bảng biểu … Cuối cùng, bài viết hi vọng bạn đọc hiểu được tư tưởng và nắm được cách thức để tạo ra một custom tag như thế nào.

Good luck!

Advertisements

One comment on “Giới thiệu về JSP Custom Tag

Trả lời

Mời bạn điền thông tin vào ô dưới đây hoặc kích vào một biểu tượng để đăng nhập:

WordPress.com Logo

Bạn đang bình luận bằng tài khoản WordPress.com Đăng xuất /  Thay đổi )

Google photo

Bạn đang bình luận bằng tài khoản Google Đăng xuất /  Thay đổi )

Twitter picture

Bạn đang bình luận bằng tài khoản Twitter Đăng xuất /  Thay đổi )

Facebook photo

Bạn đang bình luận bằng tài khoản Facebook Đăng xuất /  Thay đổi )

Connecting to %s