Show Serbian date picker with Latin characters

Recently I had to investigate a requirement, where a translated application to Serbian language was showing Cyrillic characters, whereas the customer wanted to see Latin characters.

Turns out that Oracle APEX supports only traditional (Cyrillic) Serbian, not the Latin variation. So when setting an APEX application to Serbian a TO_CHAR(SYSDATE,’Month’) shows “Октобар” instead of “Oktobar”.

No problem, we can fix that easily by adding some lines of PL/SQL  to Shared Components > Security Attributes > Initialization PL/SQL Code


Great, now TO_CHAR(SYSDATE,’Month’) shows “Oktobar”.

Leaves us now with the problem of the date picker, which still uses Cyrillic characters.

Turns out, that this defined in a language specific datepicker file in the depths of the images directory.

Now we could grab that file and edit it, but that would be lost at the next APEX upgrade. Unfortunately we can’t add JS code to our page or application to change that locale definition, since there is no hook for us to change it before the page items get initialized with the loaded settings. Our only chance is to change the datepicker settings of all (already initialized) page items once APEX is done rendering the page.

So what we do is grab that files content, translate it to Latin Serbian, and add some code to change all datepicker items on that page. Of course all that code should only run, once APEX is done with the page:

$(window).on("theme42ready", function () {
if (jQuery("html").attr("lang") === 'sr') {
apex.jQuery.datepicker.regional['sr-SR'] = {
closeText: 'Zatvori',
prevText: "<",
nextText: ">",
currentText: 'Danas',
monthNames: ['Januar','Februar','Mart','April','Maj','Jun','Jul','Avgust','Septembar','Oktobar','Novembar','Decembar'],
monthNamesShort: ['Jan','Feb','Mar','Apr','Maj','Jun','Jul','Avg','Sep','Okt','Nov','Dec'],
dayNames: ['Nedelja','Ponedeljak','Utorak','Sreda','Četvrtak','Petak','Subota'],
dayNamesShort: ['Ned','Pon','Uto','Sre','Čet','Pet','Sub'],
dayNamesMin: ['Ne','Po','Ut','Sr','Če','Pe','Su'],
weekHeader: 'Sed',
dateFormat: "",firstDay: 1,
isRTL: false,
showMonthAfterYear: false,
yearSuffix: "",
ampmNames: ["AM","PM"]};


Line 1 ensures, that everything else on the page has already been initialized.

Line 2 makes sure, that this code is run for Serbian translations, only.

Lines 3-19 define a new date picker translation ‘sr-SR’ with Latin characters.

Lines 21-23 loop through all date picker items on that page and change their instantiated config data to use the sr-SR settings.

Now all we do is put that code into a nice JS file and upload it to Shared Components > Application Static Files.

And include that file on every page, by putting it in Shared Components > User Interface Attributes > Desktop User Interface > JavaScript File URLs

Running the page now shows a date picker with Serbian Latin characters, everyone is happy.

Hope this helps someone else, since it took a while to figure out how it works.

Add a comment if you have any question, since there is hardly any useful documentation available.




Leave a Reply

Your email address will not be published. Required fields are marked *