How to bold specific Strings in an h:column

Question

I have a JSF data table that is displaying data based off a search successfully. However, I'm not sure how to selectively bold certain text data in a particular column.

So, for instance, I would like this text...

Here is some text that would be inside the h:column

to show up like this on the page...

Here is some text that would be inside the h:column

Here's what my data table looks like

Results:

<h:dataTable var="results"
             value="#{logSearcherBean.results}"
             border="1">
    <h:column>#{results.logName}</h:column>
    <h:column>#{results.matchLine}</h:column>
</h:dataTable>

What are the preconditions? Why exactly should exactly the part "text" be bold? — BalusC, Nov 01 '12 at 16:27
"text" represents text that is being searched for in several pages. When matches are found, I would like the "text" to be highlighted in the search results — Zack Macomber, Nov 01 '12 at 16:28
@BalusC - I've read that I could use `escape="false"` and then put in html but the results may already have html in them from what I've seen — Zack Macomber, Nov 01 '12 at 16:39

score 1 · Accepted Answer · edited May 23 '17 at 12:03

You could either homebrew an EL function which manipulates the column value and returns the desired HTML,

<h:outputText value="#{my:highlight(results.logName, logSearcherBean.query)}" escape="false" />

(note that this is due to escape="false", which is mandatory to present HTML literally, also sensitive to XSS attacks if the logName is a value which is fully controlled by the enduser)

Or grab JavaScript/jQuery which manipulates the returned HTML, see also this related question: Highlight a word with jQuery.

score 0 · Answer 2 · answered Jan 12 '21 at 13:57

Hi all,

                    <p:column id="lastName"
                              headerText="Last Name">
                        <h:outputText value="#{person.lastName}" style="#{myBean.getStyle(person.lastName)}"/>
                    </p:column>

And in the bean:

public String getStyle(String str) {
    return str.equals(keyword) ? "background-color: yellow" : "";
}

All best and happy coding!

How to bold specific Strings in an h:column

2 Answers2