minDate for Calendar works work with "Preview Question" but not Preview Block or Preview Survey | XM Community
Skip to main content
I am trying to restrict the date that a person can pick on a date picker question. The code I am using works when I click "Preview Question" but not when I click "Preview Block" or "Preview Survey". I tried publishing the survey to see if that made a difference, but it did not. Thoughts?



HEADER CODE



link href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.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"



JAVASCRIPT CODE



Qualtrics.SurveyEngine.addOnReady(function()

{

/*Place your JavaScript here to run when the page is fully displayed*/

jQuery("#"+this.questionId+" .InputText").datepicker({

dateFormat: 'yy-mm-dd',

minDate : "${date://CurrentDate/DS +7}",



}).attr('readonly', true);



});



Qualtrics.SurveyEngine.addOnUnload(function()

{

/*Place your JavaScript here to run when the page is unloaded*/

jQuery("#ui-datepicker-div").remove();



});
@Akdashboard Is there a reason you are using +7 in your code? It seems to work if you simply change it to minDate : "${date://CurrentDate/DS}"



The was not able to get Qualtrics to parse the "${date://CurrentDate/DS +7}" piped text in the question text or spit it out to the browser console.



(is there any documentation on the syntax for Qualtric piped text?)
@w.patrickgale



I am trying to make it so that the survey taker can't choose a date that is too soon. I'd like it if they HAD to pick a date a week in advance. That is why I have the +7 in my code. Any suggestions?
@Akdashboard Try this (or a variation of it).



var ourDate = new Date();



//Change it so that it is 7 days in the past.

var pastDate = ourDate.getDate() - 7;

ourDate.setDate(pastDate);



// format the date string for the datepicker (note we need to add +1 to the month)

var strPastDate = ourDate.getFullYear()+"-"+(ourDate.getMonth()+1)+"-"+ourDate.getDate();



jQuery("#"+this.questionId+" .InputText").datepicker({

dateFormat: 'yy-mm-d',minDate : strPastDate,}).attr('readonly', true);
Thanks Patrick! I got it to work by tweaking your -7 to +4 (not sure why 4, but it works). I then set minDate to pastDate. I didn't need the rest of the script though.



NEW JAVASCRIPT CODE

Qualtrics.SurveyEngine.addOnload(function()

{

/*Place your JavaScript here to run when the page loads*/



});



Qualtrics.SurveyEngine.addOnReady(function()

{

/*Place your JavaScript here to run when the page is fully displayed*/



var ourDate = new Date();



//Change it so that it is 7 days in the past.

var pastDate = ourDate.getDate() + 4;

ourDate.setDate(pastDate);







jQuery("#"+this.questionId+" .InputText").datepicker({

dateFormat: 'yy-mm-dd',

minDate : pastDate



}).attr('readonly', true);





});



Qualtrics.SurveyEngine.addOnUnload(function()

{

/*Place your JavaScript here to run when the page is unloaded*/



jQuery("#ui-datepicker-div").remove();



});





Also, how do I copy code in a cleaner way? If someone tells me, I will edit my posts to clean them up.

Leave a Reply