Prevent accidentially closing the survey

More
5 months 4 weeks ago #191527 by blocka
And then I found the answer. You can add this to custom.js:

(window).on('beforeunload', function(){
var c=confirm();
if(c){
return true;
}
else
return false;
});
The following user(s) said Thank You: Sweden

Please Log in to join the conversation.

More
2 months 2 weeks ago - 2 months 2 weeks ago #195219 by Sweden
This is strange - I guess I have inserted the code mentioned here , and the code in the previous post, in Custom.js and then forgot all about it. However, the result is not what I hoped it would be.

I would like to see the warning in the end message (after the survey has been submitted), if someone tries to close the tab. It doesn't work that way now - the tab closes without any warning. How do I change that?

On the other hand, I get an unwanted warning when I try to save the results as PDF. I use the plugin PDFreport where the PDF is generated when you click on the "print answers" link (settings in PDFreport/file upload question is set to "Replace public print answer"). How can I prevent that warning and still keep the other (that isn't working yet)?

LS Version is 3.22.7+200225
Last edit: 2 months 2 weeks ago by Sweden.

Please Log in to join the conversation.

More
1 month 3 weeks ago #196042 by Sweden
Hmmm.... I can't be the only one with this problem. Any ideas are welcome ;)

I forgot to mention that a warning is shown at the end page, if the user tries to close the tab/browser, but only if they have scrolled down first. They need to see a warning even if they haven't done anything.

Also, it is strange that the warning shows if a user clicks on the print/download PDF link - that is not good (more details in my last post).

tpartner and blocka provided a solution but it doesn't seem to work anymore (or not the way it should...) I hope someone can take another look at the code.

Please Log in to join the conversation.

More
1 month 3 weeks ago #196051 by tpartner
If you have a plugin that is conflicting with your desired behavior maybe you should contact the plugin developer.

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com

Please Log in to join the conversation.

More
1 month 3 weeks ago #196058 by Sweden
Thanks, but I don't think it is caused by a plugin conflict. I have tested some more and tried deactivating both PDFreport and limeMpdf and I still get the warning when I click the "print answers" link on the end page. That can be very confusing for the participants and they may do something stupid.

Also, unless they scroll down on the end page they don't get a warning if they close their browser/tab (people can easily do that by accident).

So there seems to be a conflict between the "print answers" link/funktion and the workaround code in the wiki

Please Log in to join the conversation.

More
1 month 3 weeks ago #196084 by tpartner
I can see how the "Print answers" link would trigger the confirm function as it moves to window to a new screen (closing the survey screen).

Maybe the solution is as easy as having "Print answers" open in a new tab.

Extend your theme and edit the submit.twig file (found under the Completed screen).

Change this line:
<a href="{{ aSurveyInfo.aCompleted.aPrintAnswers.sUrl }}" title={{ aSurveyInfo.aCompleted.aPrintAnswers.sTitle }} class="{{ aSurveyInfo.class.submitwrapperdivaa }}" {{ aSurveyInfo.attr.submitwrapperdivaa }}>

To this:
<a target="_blank" href="{{ aSurveyInfo.aCompleted.aPrintAnswers.sUrl }}" title={{ aSurveyInfo.aCompleted.aPrintAnswers.sTitle }} class="{{ aSurveyInfo.class.submitwrapperdivaa }}" {{ aSurveyInfo.attr.submitwrapperdivaa }}>

If this does not work, please provide the exact code you have in your custom.js file.


Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com
Attachments:
The following user(s) said Thank You: Sweden

Please Log in to join the conversation.

More
1 month 3 weeks ago - 1 month 3 weeks ago #196101 by Sweden
Wow. Thank you - that is very kind of you! :)

I have now done some testing with your code, on a PC with windows and an old iPad, both with different browsers. It's a bit confusing because there are so many combinations (devices/browsers). However, on the PC, another tab opens and quickly closes again, then the file download menu opens (so that is good, although it would be even better without the tab flickering).

On iPad, another tab opens and just shows the PDF, instead of showing the download-file-popup-window. The user may assume that the PDF has been downloaded and then closes the two tabs (and then the user will have no PDF file). Problem is also that none of the browsers I have tested on iPad shows the warning "Are you sure you want to quit the survey?" so it is easy for the user to lose the results there.

Do you have any suggestions how to change the just mentioned behavior? Also, no warning is shown on PC if users close their browser/tab, unless they scroll down a bit first. I wonder what has changed since the solution in the wiki no longer work. I don't think it is something special with my installation.

If you have time for another look - here is the code from my custom.js. I must have found it in this thread some time ago...

$(document).on('ready pjax:scriptcomplete',function(){
    /**
     * Code included inside this will only run once the page Document Object Model (DOM) is ready for JavaScript code to execute
     * @see https://learn.jquery.com/using-jquery-core/document-ready/
     */
});
 
 
//FEATURES: (2015-03-27) Now with fix for iframes (e.g. file uploader) and the template editor 
function goodbye(e) {
    if(!$('body', top.document).hasClass('submitted') && !$('#completed').length && !$('.templateeditor', top.document).length) { //check if a button was used to navigate OR the survey is completed OR the template is displayed in the template editor
 
		if(!e) e = window.event;
		//e.cancelBubble is supported by IE - this will kill the bubbling process.
		e.cancelBubble = true;
		e.returnValue = 'Are you sure you want to quit this survey?'; //This is displayed on the dialog for IE
 
		//e.stopPropagation works in Firefox.
		if (e.stopPropagation) {
			e.stopPropagation();
			e.preventDefault();
		}
 
		return 'Are you sure you want to quit this survey?'; // For chrome
	}
}
 
window.onbeforeunload = goodbye;
 
$(document).on('click', '.button, .changelang, [name="move"]', function(event){ //added .changelang here, please add other classes if you know which should be allowed to navigate
	$('body', top.document).addClass('submitted');
});
 
(window).on('beforeunload', function(){
var c=confirm();
if(c){
return true;
}
else
return false;
}); 
Last edit: 1 month 3 weeks ago by Sweden.

Please Log in to join the conversation.

More
1 month 3 weeks ago - 1 month 3 weeks ago #196133 by tpartner

Do you have any suggestions how to change the just mentioned behavior?

You cannot override the iPad browser behaviour.

Also, no warning is shown on PC if users close their browser/tab, unless they scroll down a bit first.

This is the expected behaviour. The MDN documentation for the beforeunload event states "Note: To combat unwanted pop-ups, browsers may not display prompts created in beforeunload event handlers unless the page has been interacted with, or may even not display them at all."

- developer.mozilla.org/en-US/docs/Web/API...w/beforeunload_event

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com
Last edit: 1 month 3 weeks ago by tpartner.
The following user(s) said Thank You: Sweden

Please Log in to join the conversation.

More
3 weeks 5 days ago #198290 by krosser
Can someone please suggest which class needs to be added to the code for excluding "Resume later" option?
I have managed to exclude the Index menu by adding class '.dropdown-toggle':
$(document).on('click', '.button, .changelang, .dropdown-toggle, [name="move"]', function(event){ //added .changelang here, please add other classes if you know which should be allowed to navigate
	$('body', top.document).addClass('submitted');
});


I think I have tried everything I could find and also added my own classes, but it simply did not work...

I'm using the latest LS 3.22 hosted on LS servers, not installed locally.

Please Log in to join the conversation.

Start now!

Just create your account and start using Limesurvey today.

Register now