2011-06-16 51 views
1

我试图让我的richfaces数据表具有可排序的标题。我基本上遵循这里的代码:http://richfaces-showcase.appspot.com/richfaces/component-sample.jsf?demo=dataTable&sample=tableSorting&skin=blueSky排序richfaces数据表的问题

我的标题有链接,当我点击它们时,您可以在萤火虫控制台中看到发布了一个发布请求。完成处理后,桌子上没有任何事情发生。

另外,我有一些jquery代码,当鼠标悬停在它上面时,突出显示一行。一旦你点击其中一个标题,行突出显示就不会再发生了。

这是我的代码。

<h:form> 
    <rich:dataTable value="#{protocolDetail.details.protocolEvents}" var="detail" id="table" rows="20" rowClasses="odd, even" styleClass="stable"> 

     <rich:column sortBy="#{detail.date}"> 
      <f:facet name="header"> 
       <a4j:commandLink value="Date" render="table" action="#{protocolDetail.sortByDate}" /> 
      </f:facet> 
      <f:facet name="footer"> 
       <a4j:commandLink value="Date" render="table" action="#{protocolDetail.sortByDate}" /> 
      </f:facet> 
      <h:outputText value="#{detail.date}" /> 
     </rich:column> 

     <rich:column sortBy="#{detail.description}"> 
      <f:facet name="header"> 
       <a4j:commandLink value="Description" render="table" action="#{protocolDetail.sortByDescription}" /> 
      </f:facet> 
      <f:facet name="footer"> 
       <a4j:commandLink value="Description" render="table" action="#{protocolDetail.sortByDescription}" /> 
      </f:facet> 
      <h:outputText value="#{detail.description}" /> 
     </rich:column> 

     <rich:column sortBy="#{detail.comment}"> 
      <f:facet name="header"> 
       <a4j:commandLink value="Comment" render="table" action="#{protocolDetail.sortByComments}" /> 
      </f:facet> 
      <f:facet name="footer"> 
       <a4j:commandLink value="Comment" render="table" action="#{protocolDetail.sortByComments}" /> 
      </f:facet> 
      <h:outputText value="#{detail.comment}" /> 
     </rich:column> 

    </rich:dataTable> 



</h:form> 
<rich:jQuery selector=".stable tr" event="mouseover" query="jQuery(this).addClass('active')" /> 
<rich:jQuery selector=".stable tr" event="mouseout" query="jQuery(this).removeClass('active')" /> 

豆:

@ManagedBean(name = "protocolDetail") 
@SessionScoped 
public class ProtocolDetailBacker extends BaseObject { 

    private String protocol = ""; 
    private int studyNumber; 

    // private ArrayList<ProtocolDetailBean> details; 
    private ProtocolDetailBean details = new ProtocolDetailBean(); 
    ProtocolDAO dao = new ProtocolDAO(); 
    private SortOrder dateOrder = SortOrder.UNSORTED; 
    private SortOrder descriptionOrder = SortOrder.UNSORTED; 
    private SortOrder commentsOrder = SortOrder.UNSORTED; 

    public ProtocolDetailBacker() { 
     FacesContext context = FacesContext.getCurrentInstance(); 
     String[] values = context.getExternalContext().getRequestParameterValuesMap().get("protocol"); 
     setProtocol(values[0]); 
    } 

    public String getProtocol() { 
     return protocol; 
    } 

    public void setProtocol(String protocol) { 
     this.protocol = protocol; 
    } 

    public ProtocolDetailBean getDetails() { 

     try { 
      studyNumber = dao.getStudyNumber(getProtocol()); 
      details.setProtocolNumber(getProtocol()); 
      details.setStudyChair(dao.getStudyChair(studyNumber)); 
      details.setShortDesc(dao.getShortDescription(studyNumber)); 
      details.setLongDesc(dao.getLongDescription(studyNumber)); 
      details.setPdc(dao.getPDC(studyNumber)); 
      details.setProtocolEvents(dao.getProtocolEventDetails(getProtocol())); 
      System.out.println(""); 

     } catch (SQLException e) { 

      e.printStackTrace(); 
     } 

     return details; 
    } 

    public void setDetails(ProtocolDetailBean details) { 
     this.details = details; 
    } 

    public int getStudyNumber() { 
     return studyNumber; 
    } 

    public void setStudyNumber(int studyNumber) { 
     this.studyNumber = studyNumber; 
    } 

    public SortOrder getDateOrder() { 
     return dateOrder; 
    } 

    public void setDateOrder(SortOrder dateOrder) { 
     this.dateOrder = dateOrder; 
    } 

    public SortOrder getDescriptionOrder() { 
     return descriptionOrder; 
    } 

    public void setDescriptionOrder(SortOrder descriptionOrder) { 
     this.descriptionOrder = descriptionOrder; 
    } 

    public SortOrder getCommentsOrder() { 
     return commentsOrder; 
    } 

    public void setCommentsOrder(SortOrder commentsOrder) { 
     this.commentsOrder = commentsOrder; 
    } 

    public void sortByDate() { 
     descriptionOrder = SortOrder.UNSORTED; 
     commentsOrder = SortOrder.UNSORTED; 

     System.out.println("dateOrder = "+dateOrder); 
     if(dateOrder.equals(SortOrder.ASCENDING)) { 
      setDateOrder(SortOrder.DESCENDING); 
      System.out.println("dateOrder now = "+dateOrder); 
     } else if(dateOrder.equals(SortOrder.DESCENDING)) { 
      setDateOrder(SortOrder.ASCENDING); 
      System.out.println("dateOrder now = "+dateOrder); 
     } else { 
      setDateOrder(SortOrder.ASCENDING); 
      System.out.println("else dateOrder now = "+dateOrder); 
     } 
    } 

    public void sortByDescription() { 
     dateOrder = SortOrder.UNSORTED; 
     commentsOrder = SortOrder.UNSORTED; 

     System.out.println("dateOrder = "+dateOrder); 
     if(descriptionOrder.equals(SortOrder.ASCENDING)) { 
      setDescriptionOrder(SortOrder.DESCENDING); 
      System.out.println("dateOrder now = "+dateOrder); 
     } else if(descriptionOrder.equals(SortOrder.DESCENDING)) { 
      setDescriptionOrder(SortOrder.ASCENDING); 
      System.out.println("dateOrder now = "+dateOrder); 
     } else { 
      setDescriptionOrder(SortOrder.ASCENDING); 
      System.out.println("else dateOrder now = "+dateOrder); 
     } 
    } 

    public void sortByComments() { 
     descriptionOrder = SortOrder.UNSORTED; 
     commentsOrder = SortOrder.UNSORTED; 

     System.out.println("dateOrder = "+dateOrder); 
     if(commentsOrder.equals(SortOrder.ASCENDING)) { 
      setCommentsOrder(SortOrder.DESCENDING); 
      System.out.println("dateOrder now = "+dateOrder); 
     } else if(commentsOrder.equals(SortOrder.DESCENDING)) { 
      setCommentsOrder(SortOrder.ASCENDING); 
      System.out.println("dateOrder now = "+dateOrder); 
     } else { 
      setCommentsOrder(SortOrder.ASCENDING); 
      System.out.println("else dateOrder now = "+dateOrder); 
     } 
    } 

} 
+0

我相信你需要在你的列上添加sortOrder属性。 – 2011-06-17 08:09:02

+0

我很确定我尝试过。我结束了从我的脸tomahawk使用dataTable。这很容易。 – Catfish 2011-06-17 12:36:38

回答

2

排序你的表重新创建行。因此,排序后,onmouseover和onmouseout事件不会再绑定到您的行。

幸运的是,jQuery可以通过创建一个活动处理程序来处理这个问题。 Live-Handlers也会触发行,在执行jQuery调用之后添加。

对我来说,以下工作:

<rich:jQuery selector=".stable tr" query="live('mouseover mouseout', function(event) { 
       if (event.type == 'mouseover') { 
       jQuery(this).addClass('active-row'); 
       } else { 
       jQuery(this).removeClass('active-row'); 
       }});"/> 
+0

解决了鼠标悬停的部分,但表格标题在点击时没有实际排序。 – Catfish 2011-07-08 12:26:25

+0

你说得对。我只是瞥了一眼你的问题,因为我正在寻找其他问题的答案。 Richfaces令我疯狂: -/ – 2011-07-08 12:32:43

+0

无论如何,我在客户端使用如下代码进行排序: ' ...' – 2011-07-08 12:33:40

0

如果有人还在寻找这个答案,如果您使用RichFaces的4.0和JSF 2,可以尝试设置JSF的部分状态保存到真正在你的网页。如下图所示的xml:

<context-param> 
    <param-name>javax.faces.PARTIAL_STATE_SAVING</param-name> 
    <param-value>true</param-value> 
</context-param> 
+1

这已经是默认值。但的确,将其设置为“假”会中断射频列的排序。另见https://issues.jboss.org/browse/RF-11333,几个月前我已经报道过。 – BalusC 2011-12-02 20:26:23

1

我也有同样的问题与在RichFaces的给出的示例代码工作演示,还是同样的问题

我加入F:AJAX到一个:commandlink现在排序得到正确更新

<a4j:commandLink execute="@this" value="Vendor" 
render="carstable" action="#{carsSortingBean.sort}"> 
<f:param name="sortProperty" value="vendor" /> 
<f:ajax render="carstable" /> 
</a4j:commandLink>