Using Javascript | XM Community
Skip to main content
Hello,



I am trying to program in a question that has a calendar format using javascript code I found. I have never used javascript so I am not sure how to program it into Qualtrics. The code is below and I have tried to insert it into the Javascript option when creating a new question. However, it doesn't appear to do anything. Could anyone advise me on how to get it to work? I also have html code if that would be easier to program. I tried inserting that in the html option when you click on rich text but it didn't seem to work.



Here is the link to the javascript and html code.

https://codepen.io/Lewis65/pen/wGjKQg
This discussion may help get you on the right track here: https://www.qualtrics.com/community/discussion/comment/3457#Comment_3457
Thanks Anthony, I see that it tells you how to create a calendar. However, I am trying to ask participants to pick the dates on the calendar from the last 30 days. The date in which they take the survey should determine the dates they see on the calendar. From there, I am trying to get them to be able to self-report how much they drank on these days, how many hours they drank, and how many hours high on marijuana. Aside from picking the date, I am not sure how to associate these dates with boxes to fill out these questions. I am trying to use the code in the link and customize it to my questions.



Here is the link to the javascript and html code.

https://codepen.io/Lewis65/pen/wGjKQg
You can directly use calendar question from Qualtrics library.
How do I add on the questions using the Calendar question in Qualtrics? Also, how do I ensure that participants are only able to answer about the 30 days prior to the date they are taking the survey?
Hello @mailysteers ,



This will allow participants to select only dates 30 days prior to the date they are taking the survey:



Step 1: Paste the following code in the "Look and feel" -> "Advanced" -> "header"(edit) -> "Source"(<>)



<link href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet" />

<link href="/resources/demos/style.css" rel="stylesheet" />

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>

<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

</script><script src="https://jqueryui.com/resources/demos/datepicker/i18n/datepicker.js"></script>



Step 2: Add following js(OnReady) to the Text Entry question where participants selects the date



jQuery( "[id='QR~"+this.questionId+"']" ).datepicker({

minDate: -30 ,

maxDate: -1

}).attr('readonly', true);
Thank you Shashi! I’m wondering how I add drop down menus for questions on the dates within the last 30 days. For instance, I want to ask participants how many drinks they drank on each day in the last 30 days, how many hours they drank, and hours high.



Format on the calendar day would be the following with a drop down menu,

# Drinks

Hrs Drinking

Hrs High



Also, before they see the calendar, I would like to pipe in dates they indicate were important over the last 30 days (e.g., birthdays, holidays, anniversaries, stressful days) that would help jog their memory as to when they drank.
!

Similar to this or the questions are on the actual calendar.

Leave a Reply