Given a Group and Rank question, is it possible to add a popup/window that:
(1) Pops when the user presses the Next button & there aren't exactly 2 answers in the column.
(2) Asks "Are you sure you would like to continue?", the button Yes will continue to the next question, the button No will return to the same question.
(*) Clarification: I DO NOT want to FORCE an answer, only to check validation.
Thanks in advance.
Solved
Costume Conditional Proceeding for Pick, Group and Rank Questions
Best answer by AnthonyR
Try something like this!
Preview
Note you will need to use CSS to style CustomButton to match your themes NextButton.
Qualtrics.SurveyEngine.addOnReady(function()
{
const numberPerGroup = 2;
const errorMessage = 'Not every group has 2 elements, are you sure you want to continue?';
const that = this;
this.hideNextButton();
var btn = jQuery('<input id="CustomButton" class="NextButton Button" title=" >> " type="button" name="NextButton" value=" >> " aria-label="Next">')
jQuery('#Buttons').append(btn);
jQuery('#CustomButton').on('click', function(){
let passing = true
const groups = jQuery('.Group').map(function(){
return jQuery(this).find('ul');
}).map(function(){
return jQuery(this).map(function(){
return jQuery(this).find('li')
})
});
groups.each(function(){
if(jQuery(this)[0].length !== numberPerGroup){
passing = false
}
});
if(!passing){
let cont = confirm(errorMessage);
if(cont){
that.clickNextButton();
}
}else{
that.clickNextButton();
}
});
});
View originalPreview
Note you will need to use CSS to style CustomButton to match your themes NextButton.
Qualtrics.SurveyEngine.addOnReady(function()
{
const numberPerGroup = 2;
const errorMessage = 'Not every group has 2 elements, are you sure you want to continue?';
const that = this;
this.hideNextButton();
var btn = jQuery('<input id="CustomButton" class="NextButton Button" title=" >> " type="button" name="NextButton" value=" >> " aria-label="Next">')
jQuery('#Buttons').append(btn);
jQuery('#CustomButton').on('click', function(){
let passing = true
const groups = jQuery('.Group').map(function(){
return jQuery(this).find('ul');
}).map(function(){
return jQuery(this).map(function(){
return jQuery(this).find('li')
})
});
groups.each(function(){
if(jQuery(this)[0].length !== numberPerGroup){
passing = false
}
});
if(!passing){
let cont = confirm(errorMessage);
if(cont){
that.clickNextButton();
}
}else{
that.clickNextButton();
}
});
});
+391. If you want toforce for 2 item to be dragged to group. Than you can add validation on right in Must select for Atleast=2 and Nomorethan=2. If any one drag less than 2 it will display error message "Please answer at least 2 choice(s)."
+39You can also popup question, For this you have to create a new question with Yes No. And have to add display logic like if only one is grouped or None is grouped. And than if someone click yes you can go further.
You have to add these two questions (group and rank , are you sure...) in seperate block.
For No: add same block where you have main question group and rank in survey flow again add this block in branch for No in "Are you sure...?"
You have to add these two questions (group and rank , are you sure...) in seperate block.
For No: add same block where you have main question group and rank in survey flow again add this block in branch for No in "Are you sure...?"
+13Hey @LabbyLab! The Request Response feature may be helpful while you wait for a custom code solution!
> @LaurenK said:
> Hey @LabbyLab! The Request Response feature may be helpful while you wait for a custom code solution!
Hello @LaurenK ,
Pick,Group and questions do not have Request Response option.
> Hey @LabbyLab! The Request Response feature may be helpful while you wait for a custom code solution!
Hello @LaurenK ,
Pick,Group and questions do not have Request Response option.
+7Try something like this!
Preview
Note you will need to use CSS to style CustomButton to match your themes NextButton.
Qualtrics.SurveyEngine.addOnReady(function()
{
const numberPerGroup = 2;
const errorMessage = 'Not every group has 2 elements, are you sure you want to continue?';
const that = this;
this.hideNextButton();
var btn = jQuery('<input id="CustomButton" class="NextButton Button" title=" >> " type="button" name="NextButton" value=" >> " aria-label="Next">')
jQuery('#Buttons').append(btn);
jQuery('#CustomButton').on('click', function(){
let passing = true
const groups = jQuery('.Group').map(function(){
return jQuery(this).find('ul');
}).map(function(){
return jQuery(this).map(function(){
return jQuery(this).find('li')
})
});
groups.each(function(){
if(jQuery(this)[0].length !== numberPerGroup){
passing = false
}
});
if(!passing){
let cont = confirm(errorMessage);
if(cont){
that.clickNextButton();
}
}else{
that.clickNextButton();
}
});
});
Preview
Note you will need to use CSS to style CustomButton to match your themes NextButton.
Qualtrics.SurveyEngine.addOnReady(function()
{
const numberPerGroup = 2;
const errorMessage = 'Not every group has 2 elements, are you sure you want to continue?';
const that = this;
this.hideNextButton();
var btn = jQuery('<input id="CustomButton" class="NextButton Button" title=" >> " type="button" name="NextButton" value=" >> " aria-label="Next">')
jQuery('#Buttons').append(btn);
jQuery('#CustomButton').on('click', function(){
let passing = true
const groups = jQuery('.Group').map(function(){
return jQuery(this).find('ul');
}).map(function(){
return jQuery(this).map(function(){
return jQuery(this).find('li')
})
});
groups.each(function(){
if(jQuery(this)[0].length !== numberPerGroup){
passing = false
}
});
if(!passing){
let cont = confirm(errorMessage);
if(cont){
that.clickNextButton();
}
}else{
that.clickNextButton();
}
});
});
Leave a Reply
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.