I am working on a scheduling/event appointment interface.
I am using the calendar from the question library (Import from library > Qualtrics library > demographics > calendar and date questions > enter a date (first questions)
My prompt asks respondents to pick a date. Is there any way to only highlight available dates? For instance, I want respondents only to be able to pick April 22, April 25, May 2, and May 15.
Thanks,
Page 1 / 1
Hi @QualtricsDude
I don't know if you can highlight, but you can enforce a choice by, Add validation --> custom
You can create a error message where they can see the other options.
Hey @QualtricsDude
To restrict certain dates in a Qualtrics date picker using JavaScript, you can utilize Qualtrics' JavaScript APIs. Here's a basic example of how you could achieve this:
In this example, replace `"QID1"` with the ID of your date picker element, and adjust the `disabledDates` array to include the dates you want to restrict. This script will disable the dates specified in the `disabledDates` array in the date picker.
You can modify this code as per your choice, let me know incase of any problem or help needed
Thanks!
Hi @QualtricsDude ,
You can achieve this by using JavaScript to dynamically disable dates that are not available in the calendar question. Please find the below code and Replace ”QID1” with the actual question ID of your calendar question.
Qualtrics.SurveyEngine.addOnload(function() { var unavailableDates = e"2024-04-22", "2024-04-25", "2024-05-02", "2024-05-15"]; // Define the unavailable dates
var calendarQuestionId = "QID1"; // Replace 'QID1' with your question ID
jQuery("#" + calendarQuestionId + "-table td").each(function() { var date = jQuery(this).attr("aria-label"); if (date && unavailableDates.indexOf(date) === -1) { jQuery(this).addClass("CalendarDay--blocked"); } }); });