How can I replace PrimeFaces DataTable pagination with custom buttons?

Question

I want to replace the standard DataTable pagination buttons with a custom JSF h:outputtext.

This is the current impl:

Now I need to change the button completely. The problem is that I'm using JSF messages.properties file because of different languages.

This is how it should looks like:

So I first thought that I can replace it with JS but this can't work because of different languages. So when a user is a chinese person, the text must change from "Next" to "下一個" and this can't be done via a JS script because the DOM is already loaded and JS has no JSF functionality.

This is the next button from the DOM:

<a href="#" class="ui-paginator-next ui-state-default ui-corner-all ui-state-hover" aria-label="Next Page" tabindex="0"><span class="ui-icon ui-icon-seek-next">N</span></a>

So I need to do something like this:

<a href="#" class="ui-paginator-next ui-state-default ui-corner-all ui-state-hover" aria-label="Next Page" tabindex="0"><span>#{msgs.nextMessage} &rarr;</span></a>

But how?

Answer 1

You should have multiple messages.properties files, each for your different language right? An example below showing how I'd make an app that deals with English and Spainish.

You'll have a message.properties with: greeting = Hello!

You'll then want a message_sp.properties with: greeting = Hola!

You will need to update you faces-config.xml you'll have want to make sure you have following.

 <application>
     <locale-config>
         <default-locale>en_GB</default-locale>
         <supported-locale>sp</supported-locale>
     </locale-config>

     <resource-bundle>
         <base-name>uk.police.ecis.message</base-name>
         <var>message</var>
     </resource-bundle>
 </application>

Then in your JSF file, write something like this:

<a href="#" class="paginatorStyle" aria-label="Next Page" tabindex="0"><span>#{message.greeting} &rarr;</span></a>

It'll figure out the rest for you. Internationalization within JSF is what you are trying to do. Hope that helps.