Hello, I'm using the select2 script and I'm having a bug come up. I have a list of schools in my survey that I want my users to select from. When I use it in a survey (please feel free to use this preview link to see for yourself), the box is displaying in all my following questions. NOTE: This is happening in the real survey as well. Does anyone happen to know if this is a Qualtrics bug? Do anyone have any solutions?
This is the image that comes up in the next page of my survey. It should simply be the next question.
Page 1 / 1
I think it works, but it is super slow. I've used select2 with Qualtrics many times and never had a performance issue. Post your JS.
In the question itself, I have: Qualtrics.SurveyEngine.addOnReady(function() { /*Place your JavaScript here to run when the page is fully displayed*/ jQuery("#"+this.questionId).find('select:first').select2(); }); In the header I have the following HTML: https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />">https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js">
Hey Tom, Do you have any thoughts on this? Thanks, Mark
malush1412 , I just took another look at it. I think it is slow because you have 6,219 schools in the list. To speed it up you need to store the schools in an external database and use the select2 ajax functionality to populate the list of schools in smaller chunks.
Any idea why the school drop down is showing up on the next questions? Seems like a bug.
I think it is related to the list length and performance issue. Select2 creates a temporary list outside the virtual JFE page and it isn't able to destroy the list fast enough before Qualtrics moves to the next page.
Got it! Thanks so much for all the feedback.
Ah - so it seems as though the list is disappearing one the follow up questions, but only once you click into the list again. Wonder if there's a workaround to stop that bug from showing up?
You need to focus on the performance issue because even without the bug the usability is awful. ajax is the solution.
I'm loading the file up - but even as I test this with 4 options (A, B, C, D) the box is displaying in the following questions.
Thanks for the tip, Tom. That seems to have fixed it! Thanks so much for the help! Old header in Qualtrics: https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" /> ">https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"> New header: https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" /> ">https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/js/select2.min.js">