I'm using a date picker (pikaday) to collect date of birth and also check that the survey taker's age is between 16-22 using the following javascript.
!
However, I need to translate this to German, Spanish and Dutch (both the calendar itself and the output).
!
How would I go about this?
Thank you in advance
Page 1 / 1
Use the pickaday i18n option.
Thanks @TomG, I have worked out how to use the i18n. I am trying to use if-else to display the correct translation, although there is something wrong. Would you mind telling me how to fix the following?
Qualtrics.SurveyEngine.addOnload(function()
{
var inputId = 'QR~' + this.questionId;
var picker = new Pikaday(
{
field: document.getElementById(inputId),
firstDay: 1,
defaultDate: new Date(2000,0),
i18n:
if ("${e://Field/Q_Language}" = "ES-ES") {
month:["enero", "febrero", "marzo", "abril", "mayo", "junio", "julio", "agosto", "septiembre", "octubre", "noviembre", "diciembre"],
weekdays: ["domingo","lunes","martes","miércoles","jueves","viernes","sábado"],
weekdaysShort: ["dom","lun","mar","mier","jue","vie","sab"],
};
else if ("${e://Field/Q_Language}" = "NL") {
months: ["Januari", "Februari", "Maart", "April","Mei", "Juni", "Juli", "Augustus", "September", "October", "November", "December"],
weekdays: ["zondag", "maandag", "dinsdag", "woensday", "vrijdag", "zaterdag"],
weekdaysShort: ["zo", "ma", "di", "wo", "vr", "za"],
};
else if ("${e://Field/Q_Language}" = "DE") {
months: ["Januar", "Februar", "März", "April", "Mai", "Juni", "Juli", "August", "September", "Oktober", "November", "Dezember"],
weekdays: ["Sonntag", "Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag"],
weekdaysShort: ["So", "Mo", "Di", "Mi", "Do", "Fr", "Sa"],
};
onSelect: function(date)
{
var todayInSeconds = new Date().getTime();
var birthdayInSeconds = date.getTime();
var ageInSeconds = todayInSeconds - birthdayInSeconds;
var ageInYears = Math.floor(ageInSeconds / (1000 * 3600 * 24) / 365);
Qualtrics.SurveyEngine.setEmbeddedData("Age", ageInYears);
},
});
});
I appreciate it would be a lot easier to just set up a different question for each language and use display logic but I am trying to learn! Thank you so much for your help.
@Sarah646,
You can't do if-else logic inside an object definition. I would create a separate object with the languages as keys, then just reference the correct i18n value in the pickaday setup:
```
var languages = {
"ES-ES": {
month:["enero", "febrero", "marzo", "abril", "mayo", "junio", "julio", "agosto", "septiembre", "octubre", "noviembre", "diciembre"],
weekdays: ["domingo","lunes","martes","miércoles","jueves","viernes","sábado"],
weekdaysShort: ["dom","lun","mar","mier","jue","vie","sab"],
},
"NL": {
months: ["Januari", "Februari", "Maart", "April","Mei", "Juni", "Juli", "Augustus", "September", "October", "November", "December"],
weekdays: ["zondag", "maandag", "dinsdag", "woensday", "vrijdag", "zaterdag"],
weekdaysShort: ["zo", "ma", "di", "wo", "vr", "za"],
},
...etc...
};
```
Then in the pickaday setup:
```
i18n: languages['${e://Field/Q_Language}']
```
@TomG , thank you so much this is now working except in Spanish. Any idea why?
Qualtrics.SurveyEngine.addOnload(function()
{
var inputId = 'QR~' + this.questionId;
var languages = {
"ES-ES": {
month:["enero", "febrero", "marzo", "abril", "mayo", "junio", "julio", "agosto", "septiembre", "octubre", "noviembre", "diciembre"],
weekdays: ["domingo","lunes","martes","miércoles","jueves","viernes","sábado"],
weekdaysShort: ["dom","lun","mar","mier","jue","vie","sab",],
},
"NL": {
months: ["Januari", "Februari", "Maart", "April", "Mei", "Juni", "Juli", "Augustus", "September", "October", "November", "December"],
weekdays: ["zondag", "maandag", "dinsdag", "woensday", "donderdag", "vrijdag", "zaterdag"],
weekdaysShort: ["zo", "ma", "di", "wo", "do", "vr", "za",],
},
"DE": {
months: ["Januar", "Februar", "März", "April", "Mai", "Juni", "Juli", "August", "September", "Oktober", "November", "Dezember"],
weekdays: ["Sonntag", "Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag"],
weekdaysShort: ["So", "Mo", "Di", "Mi", "Do", "Fr", "Sa",],
},
"EN": {
months: ['January','February','March','April','May','June','July','August','September','October','November','December'],
weekdays: ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'],
weekdaysShort: ['Sun','Mon','Tue','Wed','Thu','Fri','Sat',],
},
};
var picker = new Pikaday(
{
field: document.getElementById(inputId),
firstDay: 1,
defaultDate: new Date(2000,0),
i18n: languages['${e://Field/Q_Language}'],
format: "DD/MM/YYYY",
onSelect: function(date) {
var todayInSeconds = new Date().getTime();
var birthdayInSeconds = date.getTime();
var ageInSeconds = todayInSeconds - birthdayInSeconds;
var ageInYears = Math.floor(ageInSeconds / (1000 * 3600 * 24) / 365);
Qualtrics.SurveyEngine.setEmbeddedData("Age", ageInYears);
},
});
});
Qualtrics.SurveyEngine.addOnReady(function()
{
jQuery("#"+this.questionId+" .InputText").attr("readonly",true);
});
> @Sarah646 said:
> @TomG , thank you so much this is now working except in Spanish. Any idea why?
>
My guess is the key (ES-ES) isn't matching. Are you using the correct language code? ES-ES is the code for Spanish. ES is the code for Spanish (Latin America). If you're sure you've got the right one, pipe Q_Language and copy it to the object key...maybe it is a different - character.
Fixed it, thank you so much for all your help @TomG
I want to use the code but I have problems. I pasted the same code on the JS part but do I need to have a code in my header ? how can I do this please
Thank you Tom for you answer . I used this code into my JS : Qualtrics.SurveyEngine.addOnload(function() { var inputId = 'QR~' + this.questionId; var languages = { "FR": { months: ['Janvier','Février','Mars','Avril','Mai','Juin','Juillet','Aout','Septembre','Octobre','Novembre','Décembre'], weekdays: ['Dimache','Lundi','Mardi','Mercredi','Jeudi','Vendredi','Samedi'],
}, }; var picker = new Pikaday( { field: document.getElementById(inputId), firstDay: 1, defaultDate: new Date(2000,0), i18n: languages['${e://Field/Q_Language}'], format: "DD/MM/YYYY", onSelect: function(date) { var todayInSeconds = new Date().getTime(); var birthdayInSeconds = date.getTime(); var ageInSeconds = todayInSeconds - birthdayInSeconds; var ageInYears = Math.floor(ageInSeconds / (1000 * 3600 * 24) / 365); Qualtrics.SurveyEngine.setEmbeddedData("Age", ageInYears); }, }); }); Qualtrics.SurveyEngine.addOnReady(function() { jQuery("#"+this.questionId+" .InputText").attr("readonly",true);
});
And for the Header this one : https://cdnjs.cloudflare.com/ajax/libs/pikaday/1.6.1/css/pikaday.min.css" rel="stylesheet" type="text/css" />">https://cdnjs.cloudflare.com/ajax/libs/pikaday/1.6.1/pikaday.min.js">