Học liferay qua ví dụ: Tạo ứng dụng áp dụng MVC portlet

Học liferay qua ví dụ: Tạo ứng dụng áp dụng MVC portlet
Liferay phân vùng M-V -C như sau:
– Model (M): Là những class được tạo bởi tool service-builder.
– View (V): Chính là các JSP.
– Controller: Chính là class portlet.
Trong liferay, để tạo 1 MVCPortlet cần thực hiện các bước sau:


1) Khởi tạo 1 mvc portlet: bao gồm tạo portlet class, jsp hiển thị ban đầu và các khai báo của
portlet.
Sử dụng Eclipse IDE để tạo.

2) Bổ sung code để thực hiện các Xử lý nghiệp vụ khác
Ví dụ sau mô tả 1 portlet có 1 form để cho phép Quản lý Sản phẩm. Form mô tả như hình sau:



Mô tả nghiệp vụ:
– Sau khi input đầy đủ thông tin, click button Save thì data được lưu vào database và load data ra danh sách bên dưới.

– Nếu click link Add new Product thì sang form Quan lý Product như hình bên dưới(quan lý tương tự Form quản lý category)



– Nếu click link edit thì sang form edit .Sau khi cập nhật thành công redirect trở lại trang quan lý catagory




Link delete để xóa bản ghi.

Bước 1: Xử lý hiển thị khởi tạo
Giả sử sau khi sử dụng eclipse để khởi tạo portlet như sau: class: ProductPortlet, view-jsp:
view.jsp (Nội dung hiển thị của view.jsp chính là form quản lý category như hình trên).

Bước 2: Tạo Form
Tạo file /html/init.jsp để import các thư viên cần thiết (không trình bày ở đây)

Ở file view.jsp thực hiện như sau:


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<%@ include file="/html/init.jsp" %>
<portlet:renderURL var="addProductURL">
<portlet:param name="jspPage" value="/html/productportlet/addProduct.jsp"/>
</portlet:renderURL>
<br/><a href="<%=addProductURL %>">Add new Product &raquo;</a>
<portlet:actionURL var="addCategoryURL" name="addCategory"/>
<aui:form name="fm" method="POST" action="<%=addCategoryURL.toString() %>">
<aui:input name="category_name" label="Category Name"/>
<aui:button type="submit" value="Save"/>
</aui:form>
<br/>
<br/>
<!-- --------------------------------------------------------------------- -->
<%                  
List<Category> list = CategoryLocalServiceUtil.getCategories(0, 100);
                    
%>
<liferay-ui:search-container delta="5"> 
       <liferay-ui:search-container-results
              results="<%=ListUtil.subList(list, searchContainer.getStart(),searchContainer.getEnd())%>"
                      total="<%=list.size() %>"/>
       <liferay-ui:search-container-row
       className="vn.softech.web.dng67.model.Category"
       modelVar="category" rowVar="">  
              <liferay-ui:search-container-column-text name="id_category" align = "left" value="<%= StringUtil.valueOf(category.getId_category()) %>"/>
              <liferay-ui:search-container-column-text name="category_name" align = "left" value="<%=category.getCategory_name()%>"/>
              <liferay-ui:search-container-column-text name="#" align="left">
              <a href="
                                  <portlet:renderURL>
                                         <portlet:param name="jspPage" value="/html/productportlet/edit.jsp" />
                                         <portlet:param name="Id_category" value="<%= StringUtil.valueOf(category.getId_category()) %>" />
                                  </portlet:renderURL>                           
                                  ">Edit</a>
              &nbsp;|&nbsp;
               <a href="
                             <portlet:actionURL name="removeCategory">
                                   <portlet:param name="Id_category" value="<%= StringUtil.valueOf(category.getId_category()) %>" />
                             </portlet:actionURL>
                            ">Remove</a>
        </liferay-ui:search-container-column-text>
    </liferay-ui:search-container-row>
     <liferay-ui:search-iterator searchContainer="<%= searchContainer %>" paginate="true"/>   
    
</liferay-ui:search-container>
<br/>
<br/>
<br/>
<hr/>
<br/><a href="<portlet:renderURL/>">&laquo;Go Back</a>
 
Giải thích:

Line 2-6: Tạo link để link tới phần quản lý sản phẩm.
Line 9 – 13: Tạo form để thêm mới sản phẩm như hình vẽ mô tả ở ví dụ. (xem thêm mục hướng dẫn tạo form với Alloy UI)
Line 19: Get dữ liệu thông qua tiện ích CategoryLocalServiceUtil cung cấp sẵn
Line 22-26: Đưa dữ liệu ra dưới dạng danh sách (xem thêm mục hướng dẫn tạo form với Alloy UI)

Bước sau sẽ hướng dẫn cách thêm action để thực hiện save data vào DB

Bước 3: Tạo action để lưu data
Xem Lines 9 và 10 của source code ở bước 2. Lines 9 định nghĩa action URL với action name là “addCategory”. Và Ở line 10, action này sẽ được thực hiện khi form được submit.

Để implement action addCategory, hãy open class ProductPortlet và bổ sung action addCategory
như sau:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
public void addCategory(ActionRequest actionRequest, ActionResponse actionResponse)
                     throws PortletException, IOException {
              String category_name = ParamUtil.getString(actionRequest, "category_name");
             
              System.out.println("Your inputs ==> "+ category_name);
              Category category = new CategoryImpl();
              // set primary key
              long catId = 01;
             
              try {
                     catId =
                                  CounterLocalServiceUtil.increment(
                                  this.getClass().getName());
              } catch (SystemException e) {
                     e.printStackTrace();
              }
              category.setId_category(catId);
              // set UI fields
              category.setCategory_name(category_name);
              // set audit field(s)
             
              try{
                     CategoryLocalServiceUtil.addCategory(category);
                     } catch(SystemException e) {
                     e.printStackTrace();
                     }
             
       }

Một số lưu ý:
– Một action theo chuẩn MVC portlet của liferay phải có 2 tham số là ActionRequest và ActionResponse.
– Lines 4: Lấy giá trị được input từ form thông qua ActionRequest. (Ở đây, thay vì sử dụng class ParamUtil thì ta có thể sử method actionRequest.getAttribute. Tuy nhiên, khuyến khích sử dụng các method của ParamUtil)
– Line 8: sử dụng local service để tạo đối tượng model (ở đây là đối tượng Category). Về việc sử dụng local service thì xem thêm Service Builder của liferay.
– Line 13: Tạo ID cho đối tượng Category. ID chỉ là giá trị tăng dần. Class
CounterLocalServiceUtil là do liferay cung cấp.
– Line 25: Sử dụng local service để lưu data vào database

Thực hiện code với chức năng edit:  

1
2
3
4
5
6
7
8
9
10
11
12
13
14
public void updateCategory(ActionRequest actionRequest, ActionResponse actionResponse) {
              //Get value for object category
              String categoryName= ParamUtil.getString(actionRequest,"category_name");
              long categoryId= ParamUtil.getLong(actionRequest, "id_category");
              try {
                     Category category= CategoryLocalServiceUtil.getCategory(categoryId);
                     category.setCategory_name(categoryName);
                     CategoryLocalServiceUtil.updateCategory(category);
              } catch(Exception ex) {
                     ex.printStackTrace();
              }
       }

File edit.jsp
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<%@ include file="/html/init.jsp" %>
<portlet:actionURL var="updateCategoryURL" name="updateCategory"/>
<h3>Edit page category</h3>
<%
       //Category category = (Category) request.getAttribute("category");
       Long idCategory=  ParamUtil.getLong(request, "Id_category");
       //System.out.println("name"+ name);
       Category category= CategoryLocalServiceUtil.getCategory(idCategory);
%>
<aui:form action="<%=updateCategoryURL %>" name="" method="post">
       <aui:input name="id_category" value="<%=category.getId_category() %>" type="text"/>
       <aui:input name="category_name" value="<%=category.getCategory_name() %>" type="text" id="category_name" label="Category Name"/>
       <aui:button-row>
              <aui:button type="submit" value="Update" name="btSave" />
       </aui:button-row>
</aui:form>
<br/><a href="<portlet:renderURL/>">&laquo;Go Back</a>

 Thực hiện code với chức năng delete:
  
1
2
3
4
5
6
7
8
9
10
public void removeCategory(ActionRequest actionRequest, ActionResponse actionResponse) {
              long categoryId= ParamUtil.getLong(actionRequest, "Id_category");
              try{
                     CategoryLocalServiceUtil.deleteCategory(categoryId);
              }
              catch(Exception ex) {
                     ex.printStackTrace();
              }
       }

 Trong đó các tham số categoryName, categoryId được lấy giá trị từ form thông qua ActionRequest

Tương tự code với quản lý sản phẩm:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
//-----------------------------------------------------------------------
       public void addProduct(ActionRequest actionRequest, ActionResponse actionResponse) throws PortletException, IOException {
             
              long IDcategory= ParamUtil.getLong(actionRequest, "id_category");
             
              String product_name = ParamUtil.getString(actionRequest, "product_name");
              String description = ParamUtil.getString(actionRequest, "description");
             
              System.out.println("Your inputs ==> "+ product_name);
              Product product = new ProductImpl();
              // set primary key
              long proId = 01;
             
              try {
                     proId =
                                  CounterLocalServiceUtil.increment(
                                  this.getClass().getName());
              } catch (SystemException e) {
                     e.printStackTrace();
              }
              product.setId_product(proId);
              product.setId_category(IDcategory);
              // set UI fields
              product.setProduct_name(product_name);
              product.setDescription(description);
              // set audit field(s)
             
              try{
                     ProductLocalServiceUtil.addProduct(product);
                     } catch(SystemException e) {
                     e.printStackTrace();
                     }
              actionResponse.setRenderParameter("jspPage", "/html/productportlet/addProduct.jsp");
       }
       public void removeProduct(ActionRequest actionRequest, ActionResponse actionResponse) {
              long productId= ParamUtil.getLong(actionRequest, "id_product");
              try{
                     ProductLocalServiceUtil.deleteProduct(productId);
                     actionResponse.setRenderParameter("jspPage", "/html/productportlet/addProduct.jsp");
              }
              catch(Exception ex) {
                     ex.printStackTrace();
              }
       }
       public void editProduct(ActionRequest actionRequest, ActionResponse actionResponse) {
              //Get value for object category
              String Productname= ParamUtil.getString(actionRequest,"product_name");
              String Description= ParamUtil.getString(actionRequest,"description");
              long categoryId= ParamUtil.getLong(actionRequest, "id_category");
              long productId= ParamUtil.getLong(actionRequest, "id_product");
              System.out.println("Your inputs ==> "+ Productname+","+productId+","+Description+","+categoryId);
              try {
                     Product product= ProductLocalServiceUtil.getProduct(productId);
                     product.setProduct_name(Productname);
                     product.setDescription(Description);
                     product.setId_category(categoryId);
                     ProductLocalServiceUtil.updateProduct(product);
                     actionResponse.setRenderParameter("jspPage", "/html/productportlet/addProduct.jsp");
              } catch(Exception ex) {
                     ex.printStackTrace();
              }
       }
 
 Một số lưu ý:

– Lines 36,44,70: Sau khi thực hiện lưu data xong thì trả về View theo khai báo như trong đường dẫn

Code các file view tương tự quản lý category

10 comments:

  1. Sao mình next mà không được. toàn load lại trang view không à

    ReplyDelete
  2. Replies
    1. Để khắc phục bấm next không được cần thêm đoạn code sau vào trước

      <%
      PortletURL iteratorURL= renderResponse.createRenderURL();
      iteratorURL.setParameter("jspPage", "/html/productportlet/view.jsp");
      %>

      Delete
    2. bạn có thể gửi file project cho mình xin được không tks bạn laphuongstyle@gmail.com

      Delete
  3. Sao mình làm vậy nó cứ báo lỗi chỗ liferay-ui:search-container là "SearchContainer is a raw type.." nhỉ?

    ReplyDelete
  4. This comment has been removed by the author.

    ReplyDelete
  5. This comment has been removed by the author.

    ReplyDelete
  6. Sử dụng iteratorURL để bấm next đc :
    <%
    PortletURL iteratorURL= renderResponse.createRenderURL();
    iteratorURL.setParameter("jspPage", "/html/productportlet/view.jsp");
    %>
    < liferay-ui:search-container delta="20" iteratorURL="<%=iteratorURL %>" >
    ----------------------------

    ReplyDelete
  7. cho hỏi file view cảu quản lý sản phẩm đâu z mọi người

    ReplyDelete
  8. CASINO GAMES - Mapyro
    Get directions, reviews and information 삼척 출장샵 for Casino GAMES in 1xbet login Nj 라이트닝 바카라 사이트 at 서울특별 출장마사지 Mapyro. 군산 출장마사지 Find your way around the casino, find where everything is located with Mapyro.

    ReplyDelete