I have a picklist like this one:
<div class="card">
<h5>Advanced</h5>
<p:pickList id="pojoPickList" value="#{pickListView.countries}" var="country"
itemValue="#{country}" itemLabel="#{country.name}" converter="#{countryConverter}"
labelDisplay="inline"
>
<f:facet name="sourceCaption">Available</f:facet>
<f:facet name="targetCaption">Starting</f:facet>
<p:ajax event="transfer" listener="#{pickListView.onTransfer}" update="msg"/>
<p:column style="width:94%">
<div class="flex align-items-center">
<span class="flag flag-#{country.code} mr-2" style="width: 30px; height: 20px" />
<h:outputText value="#{country.name}"/>
</div>
</p:column>
</p:pickList>
</div>
The buttons are labeled "Move to Target", "Move all to Target" and so on. I want to change the labels for English and for other countries. How do I go for that? I found documentation here and here, but they don't point me to where to start overwriting the default translations. I also found this question, but the addLabel
, addAllLabel
, ... attributes were removed in PrimeFaces 14.
Edit: The possible duplicate was edited afterwards to better answer this question. My description already contained a link to it and the explanation why it doesn’t answer my question. It still doesn’t, see comment section.
Just add this script to your page and change any language you want. Once you get it working move all of this to a stefan-locales.js
file and just load that file with a normal <h:outputScript>
This overrides those labels for English EN locale. Obviously you can do the same for others.
PrimeFaces.locales["en"] = $.extend(true, {}, PrimeFaces.locales["en"], {
aria: {
moveAllToSource: "Move All to Source",
moveAllToTarget: "Move All to Target",
moveBottom: "Move Bottom",
moveDown: "Move Down",
moveToSource: "Move to Source",
moveToTarget: "Move to Target",
moveTop: "Move Top",
moveUp: "Move Up",
},
});