Solved
Return to Table of Contents after each block in the Table?
I have a TOC that has several blocks. Once users start with any block, it just seems to keep going through all the blocks. Is there any way to make users return to the TOC after they finish each block?
Thanks
Best answer by NiC
Hi @treimt,
We can surely do this.
1. So firstly we will need the TOC button.
2. Now if we want the respondents of last Question in a block to be transported to TOC page you can add the following code as shown in the image given below :
jQuery("#NextButton").unbind("click");
jQuery("#NextButton").click(function() {jQuery("#JumpButton").click() });
!
Important - This code should be added on one of the questions on the last page.
3. Now if we need hide the TOC button , you can add the custom CSS in the Look & Feel Section
This would be the custom CSS:
#JumpButton{
visibility:hidden;
}
View original
Important - This code should be added on one of the questions on the last page.
3. Now if we need hide the TOC button , you can add the custom CSS in the Look & Feel Section
This would be the custom CSS:
#JumpButton{
visibility:hidden;
}
+27Hi @treimt,
We can surely do this.
1. So firstly we will need the TOC button.
2. Now if we want the respondents of last Question in a block to be transported to TOC page you can add the following code as shown in the image given below :
jQuery("#NextButton").unbind("click");
jQuery("#NextButton").click(function() {jQuery("#JumpButton").click() });
!
Important - This code should be added on one of the questions on the last page.
3. Now if we need hide the TOC button , you can add the custom CSS in the Look & Feel Section
This would be the custom CSS:
#JumpButton{
visibility:hidden;
}
Important - This code should be added on one of the questions on the last page.
3. Now if we need hide the TOC button , you can add the custom CSS in the Look & Feel Section
This would be the custom CSS:
#JumpButton{
visibility:hidden;
}
+27@treimt,
I think the easiest way to do this is to create a "TOC separator" block that contains a single descriptive text question with JS that clicks the JumpButton. Add the block after each of the other TOC blocks in your survey flow.
> @NiC said:
> Hi @treimt,
>
> We can surely do this.
> 1. So firstly we will need the TOC button.
> 2. Now if we want the respondents of last Question in a block to be transported to TOC page you can add the following code as shown in the image given below :
> jQuery("#NextButton").unbind("click");
> jQuery("#NextButton").click(function() {jQuery("#JumpButton").click() });
> !
>
> Important - This code should be added on one of the questions on the last page.
>
> 3. Now if we need hide the TOC button , you can add the custom CSS in the Look & Feel Section
> This would be the custom CSS:
> #JumpButton{
> visibility:hidden;
> }
>
>
>
A few months on... and I tried to use this code.
I added it to the JS on the last question of each block under the Table of Contents, which appears to be incorrect, because my survey just gets into an endless loop. (The TOC appears as desired, but then the next button takes me back to the previous question?)
I guess this line is the important one:
> Important - This code should be added on one of the questions on the last page._
I'm not sure what it means.
Any help please?
>
> Important - This code should be added on one of the questions on the last page.
>
> 3. Now if we need hide the TOC button , you can add the custom CSS in the Look & Feel Section
> This would be the custom CSS:
> #JumpButton{
> visibility:hidden;
> }
>
>
>
A few months on... and I tried to use this code.
I added it to the JS on the last question of each block under the Table of Contents, which appears to be incorrect, because my survey just gets into an endless loop. (The TOC appears as desired, but then the next button takes me back to the previous question?)
I guess this line is the important one:
> Important - This code should be added on one of the questions on the last page._
I'm not sure what it means.
Any help please?+27@baxybaxy68,
That's because the accepted answer has a fatal flaw. It will never allow you to click the Next button on the last page of a block. Therefore, 'Next' takes you to the last incomplete page, which is the page you just came from. Also, any questions on the last page of a block will never be recorded.
See my answer above, which shouldn't have been downvoted. Whoever did that was clueless.
Aha.
Many thanks for your quick response!
I'll try your solution instead. But how am I going to prevent the names of those 'separator' blocks from appearing in the TOC?
+27> @baxybaxy68 said:
> Aha.
> Many thanks for your quick response!
>
> I'll try your solution instead. But how am I going to prevent the names of those 'separator' blocks from appear in the TOC?
You can hide them in the TOC with JS that you put in the TOC library message. It has been a long time since I needed to do this, so the code I have is prototypejs where the name of the block is toc_sep:
```
var toctexts = $$('.TocText');
for(var i=0;i<toctexts.length;i++) {
var toctext = toctexts[i];
if(toctext.innerHTML == "toc_sep") {
$(toctext).up().up().hide();
}
}
```
+3TomG said:
You can hide them in the TOC with JS that you put in the TOC library message. It has been a long time since I needed to do this, so the code I have is prototypejs where the name of the block is toc_sep:
var toctexts = $$('.TocText');
for(var i=0;i
if(toctext.innerHTML == "toc_sep") {
$(toctext).up().up().hide();
}
}
Thanks for all the great comments. I have created a blank "separator block" between each of the real blocks. I have also hidden the TOC button. My problem is that once I run this code on the "separator clock" question, I can't get it to automatically return back to the TOC page without clicking the next button. Shouldn't a click.JumpButton work?
jQuery("#NextButton").unbind("click");
jQuery("#NextButton").click(function() {jQuery("#JumpButton").click() });
Thanks
+27In the toc_sep question, just click the Jump Button:
Qualtrics.SurveyEngine.addOnReady(function() {
jQuery("#JumpButton").click();
});
+3
TomG wrote:
In the toc_sep question, just click the Jump Button:
Qualtrics.SurveyEngine.addOnReady(function() {
jQuery("#JumpButton").click();
});
Thanks Tom!
I'm still trying to get a handle on this. I think I know just enough to be dangerous. But this now works like a charm! Except now I have a final problem. I think I understand what is happening but not sure how to fix it.
1) I have hidden the Return to TOC button in the Look & Feel CSS
2) I have a hidden 'toc_sep' block after each block I want evaluated.
3) It currently works very well until all blocks have been evaluated then it never goes to the end of survey page
I think this is because using the JumpButton leaves each of those blocks as incomplete.
I'm not sure how to get to the end of survey.
Todd
+27Once you've completed all the blocks, only the top_sep block is left as incomplete. You can count the number of completed blocks and store it in an embedded variable then click the Next button in toc_sep when you have competed all the blocks. Say you have 5 blocks.
Count completed blocks in your TOC library message:
Qualtrics.SurveyEngine.setEmbeddedData("completeBlocks",jQuery("li.Complete").length);
In toc_sep:
if(parseInt("${e://Field/completeBlocks}") < 5) jQuery("#JumpButton").click();
else jQuery("#NextButton").click();
If you don't want to go back to the TOC after the last block is completed, change 5 to 4.
HI TomG ,
Thanks so much for this great explanation.
I am just a bit stuck on putting the JS code into a Library Message. I can't seem to add JS into the html message block. Am I missing something?
Thanks so much!
Jess
+27https://www.qualtrics.com/community/discussion/comment/36650#Comment_36650You have to put JS in a