Removing underline style for a4j:commandLink

Question

Version :

Apache MyFaces 2.0 Rich Faces 4.3

Issue :

We are migrating from JSF 1.2 to JSF 2.

As there is no built-in support for sorting for rich:dataTable , we are using custom sorting solution as per rich faces showcase. The sorting works fine , only issue is since a4j:commandLink is used for sort action trigger , the column header text is coming with "underline" style. Is there any way the underline can be removed for a4j:commandLink ? The rich faces showcase doesn't show any styling for a4j:commandLink ?

Please help.

Answer 1

You need setup styleClass attribute for h:commandLink in column header.

Style

.tableColumnHeader {
    text-decoration: none;
    color: black;
}

is used like this:

<rich:dataTable id="txnTable" rows="#{referenceData.recordsPerPage}"
    style="width: 100%" rowClasses="oddrow, evenrow"
    value="#{bean.transactions}" var="res" sortMode="single">
    <rich:column id="activityDate" sortable="true"
        sortBy="#{res.activityDate}" sortOrder="descending">
            <f:facet name="header">
                <h:commandLink value="#{msg.transDate}" styleClass="tableColumnHeader">
                    <rich:componentControl target="txnTable" operation="sort">
                        <f:param name="column" value="activityDate" />
                        <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="#{bean.transactions.order == 'activityDate ASC'}" />
                    <h:graphicImage value="/images/sort/sort_des.gif"
                        style="border: 0px; vertical-align: middle;"
                        rendered="#{bean.transactions.order == 'activityDate DESC'}" />
                    <h:graphicImage value="/images/sort/sort_uns.gif"
                        style="border: 0px; vertical-align: middle;"
                        rendered="#{bean.transactions.order != 'activityDate ASC'
                            and bean.transactions.order != 'activityDate DESC'}" />
                </h:commandLink>
            </f:facet>
            <h:outputText value="#{res.activityDate}" />
    </rich:column>