Datepicker popup in english on my html form

Camunda 7 Topics Discussion & Questions
,
1

Hey guys, I have created a plugin that has two html forms responsible for two different reports, Inside of then I have two datepickers popup and I’m trying to put the context of both in portuguese, but i’m not getting this, I’ve tried to import the script “…pt-BR.js” inside of my form but didn’t work, anyone knows how to make the translation work?

2

Hi @rafaaxits,

Could you share some code snippets on how you tried to achieve that or where exactly you want to put translated content?

3 
          <div class="col-xs-6">
            <label class="col-xs-12">Data Inicio</label>
              <p class="input-group">
                <input type="text well well-sm" 
                class="form-control input-sm mousetrap"
                id="dataInicio" 
                datepicker-popup="{{format}}" 
                ng-model="dataInicio"
                is-open="openedDataInicio"
                max-date="today" 
                data-disable="false"  
                datepicker-options="dateOptions"  
                ng-required="true" 
                close-text="Close"
                style="position: absolute"/>
                <span class="input-group-btn">
                  <button type="button" class="btn btn-default input-sm mousetrap" ng-click="openDataInicio($event)"><i class="glyphicon glyphicon-calendar"></i></button>
                </span>
              </p>
          </div>
<script src="http://code.angularjs.org/1.0.8/i18n/angular-locale_pt-br.js>"

Thats the way I tried to import

4

Hi @rafaaxits,

Thank you for sharing the snippet.
There is no need to import the translations in that way.
You can simply put your translations in a file called br.json (that has the same structure like en.json) and place it in the locales directory of the target webapp (e.g. cockpit/locales).

Then in you plugin, you need to use the following format:

<label class="col-xs-12">{{ "SOME_TRANSLATION_KEY" | translate }}</label>

Does this help you?

5

I don’t know if its gonna work, because the translation file is not a json, it’s a .js. Do you think this’s not a problem?

6

@rafaaxits, Indeed it has to be a json. if you want to use the content in the file you mentioned in the description (http://code.angularjs.org/1.0.8/i18n/angular-locale_pt-br.js), you will have to extract it and store in a json file in the locales folder following a proper json syntax (please check out the default en.json file for reference).

7

I did this but still not working, I don’t what to do anymore with this bug .See as I did:
“DATETIME_FORMATS”: {
“AMPMS”: [
“AM”,
“PM”
],
“DAY”: [
“domingo”,
“segunda-feira”,
“ter\u00e7a-feira”,
“quarta-feira”,
“quinta-feira”,
“sexta-feira”,
“s\u00e1bado”
],
“MONTH”: [
“janeiro”,
“fevereiro”,
“mar\u00e7o”,
“abril”,
“maio”,
“junho”,
“julho”,
“agosto”,
“setembro”,
“outubro”,
“novembro”,
“dezembro”
],
“SHORTDAY”: [
“dom”,
“seg”,
“ter”,
“qua”,
“qui”,
“sex”,
“s\u00e1b”
],
“SHORTMONTH”: [
“jan”,
“fev”,
“mar”,
“abr”,
“mai”,
“jun”,
“jul”,
“ago”,
“set”,
“out”,
“nov”,
“dez”
],
“fullDate”: “EEEE, d ‘de’ MMMM ‘de’ y”,
“longDate”: “d ‘de’ MMMM ‘de’ y”,
“medium”: “dd/MM/yyyy HH:mm:ss”,
“mediumDate”: “dd/MM/yyyy”,
“mediumTime”: “HH:mm:ss”,
“short”: “dd/MM/yy HH:mm”,
“shortDate”: “dd/MM/yy”,
“shortTime”: “HH:mm”
},
“NUMBER_FORMATS”: {
“CURRENCY_SYM”: “R$”,
“DECIMAL_SEP”: “,”,
“GROUP_SEP”: “.”,
“PATTERNS”: [
{
“gSize”: 3,
“lgSize”: 3,
“macFrac”: 0,
“maxFrac”: 3,
“minFrac”: 0,
“minInt”: 1,
“negPre”: “-”,
“negSuf”: “”,
“posPre”: “”,
“posSuf”: “”
},
{
“gSize”: 3,
“lgSize”: 3,
“macFrac”: 0,
“maxFrac”: 2,
“minFrac”: 2,
“minInt”: 1,
“negPre”: “(\u00a4”,
“negSuf”: “)”,
“posPre”: “\u00a4”,
“posSuf”: “”
}
]

After the deafult labes presents on cockpit locale json I’ve put the labes referents to the datepicker, but it still in english