RichFaces 排序图标

Question

我正在将一个 richfaces 3.x 应用程序迁移到 4.x，我需要在数据表上添加排序功能，这不是 built，我已经添加了排序功能但我需要为排序功能放置图标，如何从 richfaces 组件 ui jar 中选择图标？我应该在项目中放置新图标然后访问它吗？

  <rich:dataTable id="showsEventsTable">

     <rich:column sortable="true" selfSorted="true" 
                    sortBy="#{show.name}" sortorder="SortOrder.ascending" sortOrder="#{sortingBean.showNameOrder}">
                    <f:facet name="header">
                        <a4j:commandLink value="Show Name" render="showsEventsTable" action="#{sortingBean.sortByShowName()}"
                        styleClass="sortingColumn" status="waitStatus">
                          <span styleClass="#{sortingBean.sortOrder}"/>
                            <h:graphicImage value="??(what should go here if am accessing richfaces components jar)" library="org.richfaces"/>
                       </a4j:commandLink>
                    </f:facet>
                    <h:outputText value="#{show.name}" />
                </rich:column>

   </rich:dataTable>

在 css 文件中

    .ascending{
       background-image: url("imgpath");
     } 

  .descending{
     background-image: url("imgpath");
  } 

  .unsorted{
     background-image: url("imgpath");
  }

Answer 1

如果您的应用程序已迁移到 RichFaces 4.5，则您不需要访问排序图标 - 它会在添加排序时自动出现。

如果应用程序已迁移到以前版本的 RichFaces 4.x，则只需在您的应用程序中添加 3 个排序图标（来自 RichFaces 3 或 RichFaces 4 jar）并使用它。

更新

以下是必须使用排序图标的示例：

<rich:column id="date" sortBy="#{rs.changeDate}" sortOrder="descending">
    <f:facet name="header">
        <h:commandLink value="#{msg.entryDate}" styleClass="tableColumnHeader">
            <rich:componentControl target="noteTable" operation="sort">
                <f:param name="column" value="date" />
                <f:param value="" />
                <f:param name="reset" value="true" />
            </rich:componentControl>
            <h:graphicImage value="/images/sort/sort_asc.gif"
                style="border: 0px; vertical-align: middle;"
                rendered="#{chNotesAction.list.order == 'changeDate ASC'}" />
            <h:graphicImage value="/images/sort/sort_des.gif"
                style="border: 0px; vertical-align: middle;"
                rendered="#{chNotesAction.list.order == 'changeDate DESC'}" />
            <h:graphicImage value="/images/sort/sort_uns.gif"
                style="border: 0px; vertical-align: middle;"
                rendered="#{chNotesAction.list.order != 'changeDate ASC'
                    and chNotesAction.list.order != 'changeDate DESC'}" />
        </h:commandLink>
    </f:facet>
    <h:outputText value="#{rs.changeDate}">
        <f:convertDateTime timeZone="#{referenceData.timezone}" pattern="MMM dd, yyyy HH:mm" />
    </h:outputText>
</rich:column>

您可以将 1 个带有 EL 的图形图像用于 value 属性，例如 order eq 'ASC' ? sort_acs.gif : (order eq 'DESC' ? sort_desc.gif : sort_unc.gif)

RichFaces 排序图标

RichFaces Sorting Icon

jsf-2

richfaces