Pulling specific dates from flatpickr via piped text? | XM Community
Solved

Pulling specific dates from flatpickr via piped text?

  • 12 May 2020
  • 8 replies
  • 117 views

Hi guys. So for a survey I'm doing I have a survey question where I used flatpickr to have participants select multiple dates from a calendar (for the purposes of my survey, they will select which days within the past month they have consumed alcohol). This results in a text entry field with whatever dates the participant selected, separated by commas.

I've got all of that implemented just fine; however, for subsequent questions I need the participants to answer, for the days they selected, how many alcoholic drinks they consumed. So it would say "You indicated that you drank on MM/DD/YYYY. On that day, how many drinks did you consume?" They would then answer that question until they have answered it for each date selected. So I'm thinking I'd need piped text to do this, but piped text by default pipes the entire text field. Is there any way to pipe a portion of the text field? If not, is there some other way to have participants answer these questions for the dates they selected?

icon

Best answer by rondev 12 May 2020, 21:01

View original

8 replies

Userlevel 7
Badge +22

Create 31 ED (day1, day2.....). On click of next button of flatpickr question split the text entry of date question using comma separator and set its value to the ED sequentially.
Create another text entry form type question with 31 fields, and pipe in the above created ED as the statement of the fields. Add display logic to each statement as if respective ED is not empty

rondev Sorry; I'm still fairly new to Qualtrics; what do you mean by ED? And for the Display logic, if I'm understanding correctly then you're saying to set it so that the text entry fields are only displayed if they contain something? Then I'm assuming I would pipe the dates from those fields in a subsequent question; again only asking them to report alcohol consumption for the fields that are not empty?

Edit: I'm seeing now that ED means embedded data? If so then I created 31 ED like you said. Not sure though how to set their values from the flatpickr question like you said.

Edit 2: Ok so I think I'm starting to get it now...so I have the 31 ED, with their values set to "${q://QID3/ChoiceTextEntryValue}" (QID3 being the flatpickr question). However, predictably this just sets the values for all of the EDs to all dates selected. So when I pipe the values for each ED to the text entry field labels for the following question, each label just shows all of the dates...you can see the survey via the link in my main post to see what I mean. So how would I get each ED to be valued based off of a comma-separated list that will come from the flatpickr question (which it sounds like what you were trying to say in the first place; I'm just not sure how to do it).

Userlevel 7
Badge +22

Edited: Create the ED in the survey flow as the very first element.
Here is the code to set ED: Just complete the ed array in line 1
Paste this in the OnReady function of text entry flat pickr question
var ed = ["day1", "day2",............................,"day31"];


var that = this;
jQuery("#NextButton").on('click',function(){
var arr = jQuery("#"+that.questionId+" .InputText").val().split(", ");
for(var i=0; i
Qualtrics.SurveyEngine.setEmbeddedData(ed[i], arr[i]);
}

});

rondev where would I put that? In the JS for the flatpickr question? Sorry...I'm not terribly familiar with JS either; I've just been trying to reverse-engineer from examples I've found online.

Currently, the code for the flatpickr question looks like the following; I tried adding your code after the flatpickr portion (with the rest of the ED names filled out) but it didn't work (text field labels wound up blank). For what it's worth, the text field labels for the second question are set to "${e://Field/day#}" where "#" is equal to 1, 2, 3, ..., or 31:
Qualtrics.SurveyEngine.addOnload(function()
{

    jQuery("#"+this.questionId+" input[type=text]").flatpickr({minDate:new Date().fp_incr(-30),maxDate:new Date().fp_incr(-1),mode: "multiple",dateFormat: "m/d/y"});

});

Userlevel 7
Badge +22

Put the code under onReady function.

rondev still not working 😞 text entry field labels for question 2 are still blank. Here's what it looks like now:
Qualtrics.SurveyEngine.addOnload(function()
{

    jQuery("#"+this.questionId+" input[type=text]").flatpickr({minDate:new Date().fp_incr(-30),maxDate:new Date().fp_incr(-1),mode: "multiple",dateFormat: "m/d/y"});

});

Qualtrics.SurveyEngine.addOnReady(function()
{
var ed = ["day1", "day2", "day3", "day4", "day5", "day6", "day7", "day8", "day9", "day10", "day11", "day12", "day13", "day14", "day15", "day16", "day17", "day18", "day19", "day20", "day21", "day22", "day23", "day24", "day25", "day26", "day27", "day28", "day29", "day30", "day31"];
    
    var arr = "${q://QID3/ChoiceTextEntryValue}".split(", ");
    
    jQuery("#NextButton").on('click',function(){
    
        for(var i=0; i        
            Qualtrics.SurveyEngine.setEmbeddedData(ed[i], arr[i]);
        }
    });
});
I tried adding the onready function for the second question as well but that did not work.

Thanks for helping me with all of this, by the way.

Userlevel 7
Badge +22

Sorry, for posting incorrect code and instructions, I have updated it in my above edited post. Make sure you have ED as first survey element above all blocks.

Hey Cynik! Did you end up figuring this out? Tried to piece it together from the comments here but it's a bit hard to follow

Leave a Reply