Primefaces 保存/通过过滤数据表结果列表

Question

目前，我正在使用具有排序/过滤功能的数据表成功地从我的数据库中显示图像元数据。在我的数据表下方，我使用第三方图像覆盖流( http://www.jacksasylum.eu/ContentFlow/ )成功显示了我的图像。在这一点上，我使用相同的列表来显示两者。在我的数据表中过滤数据后，我需要使用过滤后的数据表结果动态更新我的coverflow 中的图像列表。

使用 PrimeFaces 执行此操作的最佳方法是什么？有人能指点我一个可行的例子吗？

这是我的代码:

截图数据.xhtml

<h:form>
        <p:dataTable var="scrshot" value="#{screenshots}" paginator="true" rows="8" 
                 paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}" 
                 rowsPerPageTemplate="5,10,15" widgetVar="dataTable" draggableColumns="true"
                 emptyMessage="No screenshot data found with given criteria"> 
          <f:facet name="header"> 
            <p:outputPanel> 
                <h:outputText value="Search all fields:"/> 
                <p:inputText id="globalFilter" onkeyup="dataTable.filter()" style="width:150px" /> 
            </p:outputPanel> 
          </f:facet>
          <p:column headerText="Time" sortBy="#{scrshot.time}" filterBy="#{scrshot.time}" filterMatchMode="startsWith"> 
            <h:outputText value="#{scrshot.time}" /> 
          </p:column> 
          <p:column headerText="Id" sortBy="#{scrshot.id}" filterBy="#{scrshot.id}" filterMatchMode="startsWith"> 
            <h:outputText value="#{scrshot.id}" /> 
          </p:column> 
          <p:column headerText="User" sortBy="#{scrshot.user}" filterBy="#{scrshot.user}" filterMatchMode="startsWith"> 
            <h:outputText value="#{scrshot.user}" /> 
          </p:column>
          </p:dataTable>   
        </h:form>     
        <br/>
        <h:form>
          <p:outputPanel id="imgBlock" layout="block">
           <div class="ContentFlow"  style="width: 1400px; height: 500px" align="center">
            <div class="loadIndicator"><div class="indicator"></div></div>
            <div class="flow">
              <a4j:repeat var="img" value="#{screenshots}" rendered="true">
                 <div class="item">       
                     <img class="content" id="images" src="ImgServlet?id=#{img.id}" title="#{img.time}" draggable="true"/>
                     <div class="label">#{img.id}</div>
                  </div>
              </a4j:repeat>
             </div>         
           <div class="globalCaption"></div>
           <div class="scrollbar"><div class="slider"><div class="position"></div></div></div>
          </div>
         </p:outputPanel> 
       </h:form>   
...............

截图.java

@Entity
@XmlRootElement
@Table(name="imgTable", uniqueConstraints = @UniqueConstraint(columnNames = "id"))
public class Screenshot implements Serializable, PhotoInterface {
    private static final long serialVersionUID = 1L;

    @Id
    @GeneratedValue
   private Long id;
   private String user;
   private Timestamp time;
-------- Getters/Setters ---------

截图ListProducer.java

@RequestScoped
public class ScreenshotListProducer {
   @Inject
   private EntityManager em;

   private List<Screenshot> screenshots;

   @Produces
   @Named
   public List<Screenshot> getScreenshots() {
      return screenshots;
   }

Answer 1

我发现这是一个有趣的问题，所以我做了一些研究。首先我笑了发现this .然后我偶然发现了this .答案似乎是:

将此添加到 <p:datatable> :

<p:ajax event="filter" listener="#{bean.onFilter}" update = "@this"/>

在 bean 中:

public Map<String, String> onFilter(AjaxBehaviorEvent event) {
       DataTable table = (DataTable) event.getSource();
       List<Screenshot> obj =   table.getFilteredData();

       // Do your stuff here

       Map<String, String>  filters = table.getFilters();
       return filters;
   }