Flatpickr to choose date in text form | XM Community
Skip to main content

Hello,
I am trying to use Flatpickr to choose a date in one input field on a text form question. I have two inputs on the form, one for cell phone and another for Last Date on Campus. I only want the date picker to show up on the date question but it is showing up on both with the code below. Is there a way to only apply the date picker to a single input on a question form?
jQuery("#"+this.questionId+" .InputText").flatpickr({enableTime: false, altInput: true, altFormat: "m/d/yy", dateFormat: "m/d/yy", minDate:"2020-01", maxDate: new Date().fp_incr(0)});

Thank you for you help.

Use .eq(0) for the first field or .eq(1) for the second field. For example:
jQuery("#"+this.questionId+" .InputText").eq(1).flatpickr({
enableTime: false, altInput: true,
altFormat: "m/d/yy", dateFormat: "m/d/yy",
minDate:"2020-01", maxDate: new Date().fp_incr(0)
});

Thank you Tom, that did the trick!

https://www.qualtrics.com/community/discussion/comment/32303#Comment_32303Hi TomG in the form-field question, if I have to pass different jQuery functions to multiple fields, how do I do that? Currently, I am only able to implement it either in 1 field (using your method) or in all of them.
I tried using this code in my 5-field question, but it just did not work for more than 1 field.
jQuery("#"+this.questionId+" .InputText").eq(0).flatpickr({
altInput: true, altFormat: "M/d/yy", dateFormat: "m/d/yy"});
jQuery("#"+this.questionId+" .InputText").eq(1).flatpickr({
altInput: true, altFormat: "M/d/yy", dateFormat: "m/d/yy"});
jQuery("#"+this.questionId+" .InputText").eq(2).flatpickr({
altInput: true, altFormat: "M/d/yy", dateFormat: "m/d/yy"});

Leave a Reply


Terms & Conditions