Month-Year dropdown calculation/ validation | XM Community
Skip to main content

I have a drop-down question where I’m asking “start” Month and Year. I’ll probably use a side-by-side question.

 

I then have a second question where I’m asking “end” Month and Year - again using a side-by-side question.

 

Is it possible to validate that the “end” month-year is not earlier than the “start” month-year?

I suggest using a date picker where respondents can choose dates off the calendar icon. Instructions here on the javascript for that: https://community.qualtrics.com/custom-code-12/date-range-picker-javascript-725

 


Also, with this code, you can add the calendar date picker icon into your survey question and in the parts that I highlighted in blue, you can specify what the minimum and maximum dates that they can select are. Dates outside this range won’t be allowed to be selected.

 

Qualtrics.SurveyEngine.addOnload(function()
{
    jQuery("#"+this.questionId+" .InputText").flatpickr({altInput: true, altFormat: "m-d-Y", dateFormat: "m-d-Y", minDate:"05-21-2022", maxDate: "12-31-2022"});
});

Qualtrics.SurveyEngine.addOnReady(function()
{
    /*Place your JavaScript here to run when the page is fully displayed*/

});

Qualtrics.SurveyEngine.addOnUnload(function()
{
    /*Place your JavaScript here to run when the page is unloaded*/

});


Thanks @ash123 

I only wanted respondents to be able to choose month and year - so would the flatpickr month plugin work?

I saw a post on that: Using Flatpicker for Month/Year | XM Community (qualtrics.com) - but I’m assuming I need to change what is shown in the Look&Feel Header code, but that seems to be missing from the post?


Thanks @ash123 

I only wanted respondents to be able to choose month and year - so would the flatpickr month plugin work?

I saw a post on that: Using Flatpicker for Month/Year | XM Community (qualtrics.com) - but I’m assuming I need to change what is shown in the Look&Feel Header code, but that seems to be missing from the post?

 

I found them online, you need to add:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr@latest/dist/plugins/monthSelect/style.css">

and

<script src="https://cdn.jsdelivr.net/npm/flatpickr@latest/dist/plugins/monthSelect/index.js"></script>

to get the Flatpickr for Month/Year to work...


Leave a Reply