Calendar shows up out of place | XM Community
Skip to main content
Hi All,



So this is my first post and I'm not sure I'm putting it in the right place, but here goes:



I am working on a survey, and in the survey, I have inserted a date field with a calendar date picker via JavaScript from pikaday. This works perfectly (and is also translated to Ukrainian where it also works a treat). However, the problem is that the 'calendar' now shows up on the left-hand side of all subsequent pages in a very 'bare' looking format, e.g. below:



!



The Javascript I used is this:



Date of installation:<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/pikaday/css/pikaday.css">

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>

<script src="https://cdn.jsdelivr.net/npm/pikaday/pikaday.js"></script>





Qualtrics.SurveyEngine.addOnload(function()

{

var inputId = 'QR~' + this.questionId;

var languages = {

"UK": {

months: ["Січень", "Лютий", "Березень", "Квітень", "Травень", "Червень", "Липень", "Серпень", "Вересень", "Жовтень", "Листопад", "Грудень"],

weekdays: "Неділя", "Понеділок", "Вівторок", "Середа", "Четвер", "П’ятниця", "Субота"],

weekdaysShort: "Нд", "Пн", "Вт", "Ср", "Чт", "Пт", "Сб",],

},

"EN": {

months: o'January','February','March','April','May','June','July','August','September','October','November','December'],

weekdays: ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'],

weekdaysShort: b'Sun','Mon','Tue','Wed','Thu','Fri','Sat',],

},

};

var picker = new Pikaday(

{

field: document.getElementById(inputId),

firstDay: 1,

i18n: languages>'${e://Field/Q_Language}'],

format: 'DD/MM/YYYY',

});

});

Qualtrics.SurveyEngine.addOnReady(function()

{

jQuery("#"+this.questionId+" .InputText").attr("readonly",true);



});









I am not very good in terms of JavaScript, but can any of you please tell me how I avoid the calendar showing up 'out of place' on subsequent pages in the survey?



Thank you in advance.



Best Regards,

Trine Peckham
I fixed the issue by editing the header and inserting it as a javascript instead of directly in the html of the question text. 🙂

Leave a Reply