arya-blue
luna-amber
luna-blue
luna-green
luna-pink
nova-dark
nova-light
saga-blue
vela-blue
MarkText - Separate Word Search
Demonstrates the separateWordSearch property. When set to true, searches for each word separately; when false, searches for the exact phrase.
Search term:
Separate Word Search (separateWordSearch=true)

This is a word search example. The word is here, and search is there. Word search together in this sentence.

Exact Phrase Search (separateWordSearch=false)

This is a word search example. The word is here, and search is there. Word search together in this sentence.

Source

                <h:panelGrid columns="3">
        <h:outputText value="Search term:"/>
        <p:inputText id="searchInput" value="#{markTextController.searchTermSeparateWord}" placeholder="Enter search term">
             <p:ajax event="keyup" delay="500" update="separateWordPanel exactPhrasePanel markTextSeparateWord markTextExactPhrase"/>
        </p:inputText>
        <p:commandButton value="Highlight" update="separateWordPanel exactPhrasePanel markTextSeparateWord markTextExactPhrase" icon="pi pi-search"/>
    </h:panelGrid>

    <h:panelGrid columns="2" style="width: 100%">
        <p:panel id="separateWordPanel" header="Separate Word Search (separateWordSearch=true)" style="margin-right: 10px">
            <h:panelGroup id="separateWordContent" layout="block">
                <p>This is a word search example. The word is here, and search is there. Word search together in this sentence.</p>
            </h:panelGroup>
        </p:panel>

        <p:panel id="exactPhrasePanel" header="Exact Phrase Search (separateWordSearch=false)">
            <h:panelGroup id="exactPhraseContent" layout="block">
                <p>This is a word search example. The word is here, and search is there. Word search together in this sentence.</p>
            </h:panelGroup>
        </p:panel>
    </h:panelGrid>

    <pe:markText id="markTextSeparateWord" for="separateWordContent" value="#{markTextController.searchTermSeparateWord}" styleClass="marktext-highlight" separateWordSearch="true"/>
    <pe:markText id="markTextExactPhrase" for="exactPhraseContent" value="#{markTextController.searchTermSeparateWord}" styleClass="marktext-highlight" separateWordSearch="false"/>
            
Components and more
Documentation pe:
Attributes (move mouse over the names to see data types)
Name Description
No attributes available for this component.
PrimeFaces Extensions Showcase - © 2011-2025,PrimeFaces: 15.0.13,PrimeFaces Extensions: 15.0.14-SNAPSHOT,JSF: Apache MyFaces JSF-2.3 Core Impl 2.3.10,Server: Apache Tomcat (TomEE)/9.0.82 (8.0.16),Build time: 2026-02-23 00:32