jee6 学习笔记 4 - CRUD 1: Primefaces datatable, sorting and paging

实现简单的搜索功能:搜索学生姓名,同时利用primefaces datatable来显示结果。

screenshot: (Note, i've changed the theme from "sam" to "afterwork")

jee6 学习笔记 4 - CRUD 1: Primefaces datatable, sorting and paging_第1张图片

Backing bean StudentSearch:
package com.jxee.action.student;

import java.util.List;
import javax.ejb.EJB;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import org.apache.log4j.Logger;
import com.jxee.ejb.student.StudentDAO;
import com.jxee.model.student.Student;

@ManagedBean(name="ss")
@SessionScoped
public class StudentSearch {

  private static final Logger log = Logger.getLogger(StudentSearch.class);
  
  private List<Student> searchResultList;
  @EJB private StudentDAO dao;

  private String nameFilter;
  private int maxRows = 50;
  

  public String findByName() {
    searchResultList = dao.find(this.nameFilter, maxRows);
    return "studentSearch";
  }

  public String getNameFilter() {
    return nameFilter;
  }

  public void setNameFilter(String afilter) {
    this.nameFilter = afilter;
  }

  public int getMaxRows() {
    return maxRows;
  }

  public void setMaxRows(int maxRows) {
    this.maxRows = maxRows;
  }

  public List<Student> getSearchResultList() {
    return searchResultList;
  }

  public void setSearchResultList(List<Student> searchResultList) {
    this.searchResultList = searchResultList;
  }
  
  public int getSize() {
    return this.searchResultList != null ? this.searchResultList.size() : 0;
  }
}


StudentSearch.xhtml
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:p="http://primefaces.org/ui">
    
<h:head>
	<title>student search</title>
</h:head>

<h:body>
    
    <h:form id="form">
	    <p:panel header="Student Search Form">
	        <h:panelGrid columns="3">
	            <h:outputLabel value="Name"/>
	            <h:inputText value="#{ss.nameFilter}"></h:inputText>
	            <h:commandButton type="submit" value="Search" action="#{ss.findByName}"/>
	        </h:panelGrid>
	    </p:panel>
	    
	    <br/>
	
		<p:panel style="border:0px">
			students found: #{ss.size}
		</p:panel>
	
		<!-- search result list -->
	   	<p:dataTable id="stuDataTable" 
	   		var="st" 
	   		value="#{ss.searchResultList}" 
	   		paginator="true" rows="3">  
	   	
		    <p:column headerText="name" sortBy="#{st.name}">  
		        <h:outputText value="#{st.name}" />  
		    </p:column> 
		    
		    <p:column headerText="mobile" sortBy="#{st.mobile}">  
		        <h:outputText value="#{st.mobile}" />  
		    </p:column>  
		    
		    <p:column headerText="age" sortBy="#{st.age}">  
		        <h:outputText value="#{st.age}" />  
		    </p:column>
		    
		    <p:column headerText="created date" sortBy="#{st.created_date}">  
		        <h:outputText value="#{st.created_date}">
		        	<f:convertDateTime pattern="yyyy-MM-dd HH:mm:ss"/>
		        </h:outputText>  
		    </p:column>
		    
		</p:dataTable> 
		
    </h:form>
    
</h:body>
</html>


小姐一下:

1, it's quite simple to use the primefaces tag <p:datatable> to render search result list.

2, sorting can be achieved by <p:column> attribute "sortBy" and it takes EL expression. however, backing bean needs to be session scoped in order to hold the result set for sorting.

3, paging can be easily achieved by attribute paginator="true" rows="3".

Next will take a look at row selection and view details.

你可能感兴趣的:(Datatable,primefaces3.3)