Popups in survey or Hide/Show help text

More
2 years 5 months ago - 2 years 5 months ago #122597 by Matadeleo
Matadeleo created the topic: Popups in survey or Hide/Show help text
Hi, I'm trying to display a couple paragraphs of text as a refresher for people completing my survey -

I've tried using a JavaScript alert but this seems to reload the page when 'OK' is clicked
I've tried using a jQuery popup but without any luck

Basically I would like to have either some text, or a button in the help section which would either 'unhide' or activate a popup containing this chunk of text. The idea is to keep the page looking neat and clean, without large chunks of text in each help section.

I'm not sure if it's possible in limesurvey, but perhaps there is some way to create a Div within the help section, which when a button/link in the help section is pressed will unhide that div?

Any suggestions on how to achieve any of these things would be greatly appreciated
Last Edit: 2 years 5 months ago by Matadeleo.

Please Log in to join the conversation.

More
2 years 5 months ago #122600 by gabrieljenik
gabrieljenik replied the topic: Popups in survey or Hide/Show help text
Hi,

Have you tried creating that DIV using JQuery?

If you need that DIV for all the questions you could try omdifying the template, copying the current template and using the Template Editor.

Cheers,

Cheers,
Gabriel - www.Encuesta.Biz - Authorized Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Assistance on LimeSurvey forum and LimeSurvey core developpement are on my free time (Say thanks ?)....[img]

Please Log in to join the conversation.

More
2 years 5 months ago #122604 by Matadeleo
Matadeleo replied the topic: Popups in survey or Hide/Show help text
Unfortunately I don't know any javascript/jquery, I usually get by, by using tutorials or example code

Please Log in to join the conversation.

More
2 years 5 months ago - 2 years 5 months ago #122625 by tpartner
tpartner replied the topic: Popups in survey or Hide/Show help text
Here is an example of HTML and JavaScript that, when placed in the question help, will display two buttons that open jQuery UI modal dialogs (pop-ups).

<p>
	<button class="pop-up-button pop-up-button-1" type="button">Pop-up details 1</button><br /><br />
	<button class="pop-up-button pop-up-button-2" type="button">Pop-up details 2</button>
</p>
 
<div class="dialog-message dialog-message-1">
	<p>Some text for pop-up 1...</p>
</div>
<div class="dialog-message dialog-message-2">
	<p>Some text for pop-up 2...</p>
</div>
 
<script type="text/javascript" charset="utf-8">		
	$(document).ready(function() {
 
		// Apply jQuery UI to the buttons
		$('.pop-up-button').button();
 
		// Click events for the buttons
		$('.pop-up-button-1').on('click', function(e) {
			$('.dialog-message-1').dialog('open');
		});
		$('.pop-up-button-2').on('click', function(e) {
			$('.dialog-message-2').dialog('open');
		});
 
		// Define some pop-up options
		var dialogOptions = {
			modal: true,
			autoOpen: false,
			draggable: false,
			resizable: false,
			dialogClass: 'dialog-message-wrapper',
			buttons: {
				OK: function() {
					$(this).dialog('close');
				}
			}
		};
		// Initiate the modal pop-ups
		$('.dialog-message').dialog(dialogOptions);
 
		// Hide the pop-up title bars
		$('.dialog-message-wrapper .ui-dialog-titlebar').hide();		
	});
</script>

Sample survey attached:

File Attachment:

File Name: limesurvey...1599.lss
File Size:13 KB

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Attachments:
Last Edit: 2 years 5 months ago by tpartner.
The following user(s) said Thank You: Matadeleo

Please Log in to join the conversation.

More
2 years 4 months ago #123000 by Matadeleo
Matadeleo replied the topic: Popups in survey or Hide/Show help text

tpartner wrote: Here is an example of HTML and JavaScript that, when placed in the question help, will display two buttons that open jQuery UI modal dialogs (pop-ups).

<p>
	<button class="pop-up-button pop-up-button-1" type="button">Pop-up details 1</button><br /><br />
	<button class="pop-up-button pop-up-button-2" type="button">Pop-up details 2</button>
</p>
 
<div class="dialog-message dialog-message-1">
	<p>Some text for pop-up 1...</p>
</div>
<div class="dialog-message dialog-message-2">
	<p>Some text for pop-up 2...</p>
</div>
 
<script type="text/javascript" charset="utf-8">		
	$(document).ready(function() {
 
		// Apply jQuery UI to the buttons
		$('.pop-up-button').button();
 
		// Click events for the buttons
		$('.pop-up-button-1').on('click', function(e) {
			$('.dialog-message-1').dialog('open');
		});
		$('.pop-up-button-2').on('click', function(e) {
			$('.dialog-message-2').dialog('open');
		});
 
		// Define some pop-up options
		var dialogOptions = {
			modal: true,
			autoOpen: false,
			draggable: false,
			resizable: false,
			dialogClass: 'dialog-message-wrapper',
			buttons: {
				OK: function() {
					$(this).dialog('close');
				}
			}
		};
		// Initiate the modal pop-ups
		$('.dialog-message').dialog(dialogOptions);
 
		// Hide the pop-up title bars
		$('.dialog-message-wrapper .ui-dialog-titlebar').hide();		
	});
</script>

Sample survey attached:

File Attachment:

File Name: limesurvey...1599.lss
File Size:13 KB


Hi tpartner,

This works fantastic, exactly what I was looking for.

I noticed that this seems to not be compatible with version 2.00, only with 2.05. As I have multiple instances of limesurvey running, some of them have yet to be updated to the latest version as they have on-going surveys. Is there any way I can make this code you supplied backwards compatible with version 2.00?

Please Log in to join the conversation.

More
2 years 4 months ago #123146 by tpartner
tpartner replied the topic: Popups in survey or Hide/Show help text
This will work in both 2.0 and 2.05:

<p>
	<button class="pop-up-button pop-up-button-1" type="button">Pop-up details 1</button><br /><br />
	<button class="pop-up-button pop-up-button-2" type="button">Pop-up details 2</button>
</p>
 
<div class="dialog-message dialog-message-1">
	<p>Some text for pop-up 1...</p>
</div>
<div class="dialog-message dialog-message-2">
	<p>Some text for pop-up 2...</p>
</div>
 
<script type="text/javascript" charset="utf-8">		
	$(document).ready(function() {
 
		// Apply jQuery UI to the buttons
		$('.pop-up-button').button();
 
		// Click events for the buttons
		$('.pop-up-button-1').click(function(e) {
			$('.dialog-message-1').dialog('open');
		});
		$('.pop-up-button-2').click(function(e) {
			$('.dialog-message-2').dialog('open');
		});
 
		// Define some pop-up options
		var dialogOptions = {
			modal: true,
			autoOpen: false,
			draggable: false,
			resizable: false,
			dialogClass: 'dialog-message-wrapper',
			buttons: {
				OK: function() {
					$(this).dialog('close');
				}
			}
		};
		// Initiate the modal pop-ups
		$('.dialog-message').dialog(dialogOptions);
 
		// Hide the pop-up title bars
		$('.dialog-message-wrapper .ui-dialog-titlebar').hide();		
	});
</script>

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Please Log in to join the conversation.

More
1 year 10 months ago #130833 by Gems1389
Gems1389 replied the topic: Popups in survey or Hide/Show help text
Hi,

Sorry to be pain, I was wondering if anyone could please help. I'm trying to get this to work in my survey, however when I copy and paste it into my question help field, I just get the text that should be in the pop-ups, and no pop-up buttons. Please could someone tell me where I'm going wrong? Should I be editing it at all?

Thanks :)

P.s. I have no coding experience or Lime Survey experience, so if you could explain it like you're talking to a young child, that would be fantastic.

Please Log in to join the conversation.

More
1 year 10 months ago #130948 by tpartner
tpartner replied the topic: Popups in survey or Hide/Show help text
Here's a sample survey.

File Attachment:

File Name: limesurvey...-5-6.lss
File Size:14 KB

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Attachments:
The following user(s) said Thank You: Ben_V, Gems1389

Please Log in to join the conversation.

More
1 year 10 months ago #130950 by Gems1389
Gems1389 replied the topic: Popups in survey or Hide/Show help text

tpartner wrote: Here's a sample survey.

File Attachment:

File Name: limesurvey...-5-6.lss
File Size:14 KB


Thanks for your help. Unfortunately I'm having problems importing the example (should've mentioned that in my previous post). I get an error message saying:
"Internal Server Error
Property "Survey.questionindex" is not defined.
An internal error occurred while the Web server was processing your request. Please contact the webmaster to report this problem.
Thank you."

Do you know if I'm doing something wrong?

Thanks again

Please Log in to join the conversation.

More
1 year 10 months ago #130959 by tpartner
tpartner replied the topic: Popups in survey or Hide/Show help text
What LimeSurvey version?

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The following user(s) said Thank You: Gems1389

Please Log in to join the conversation.

More
1 year 10 months ago #130960 by Gems1389
Gems1389 replied the topic: Popups in survey or Hide/Show help text

tpartner wrote: What LimeSurvey version?


Version 2.00+ (it says Build 130213 next to that too if that is relevant).

Thanks again

Please Log in to join the conversation.

More
1 year 10 months ago #130962 by tpartner
tpartner replied the topic: Popups in survey or Hide/Show help text
You should consider updating.

Here's a 2.0 survey:

File Attachment:

File Name: limesurvey...67-2.lss
File Size:14 KB

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Attachments:
The following user(s) said Thank You: Gems1389

Please Log in to join the conversation.

More
1 year 10 months ago #130963 by Gems1389
Gems1389 replied the topic: Popups in survey or Hide/Show help text

tpartner wrote: You should consider updating.

Here's a 2.0 survey:

File Attachment:

File Name: limesurvey...67-2.lss
File Size:14 KB


Thanks! I've loaded that one in fine, however I'm still having the same problem. When I play the question in the help box it just says:
Pop-up details 1
Pop-up details 2
Some text for pop-up 1...
Some text for pop-up 2...

I was expecting something more like I'd hover over "pop-up details 1" and "some text for pop-up 1" would appear. But when I hover there isn't anything I can click on? Sorry if I'm misunderstanding.

Unfortunately I get the license through my employers, I'll ask them about updating.

Thanks

Please Log in to join the conversation.

More
1 year 10 months ago #130989 by tpartner
tpartner replied the topic: Popups in survey or Hide/Show help text
I can only think that something in your installation or template is causing a fatal JavaScript error. Can you activate a test survey and post a link here?

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The following user(s) said Thank You: Gems1389

Please Log in to join the conversation.

More
1 year 10 months ago #131043 by Gems1389
Gems1389 replied the topic: Popups in survey or Hide/Show help text

tpartner wrote: I can only think that something in your installation or template is causing a fatal JavaScript error. Can you activate a test survey and post a link here?



File Attachment:

File Name: test_limes...1867.lss
File Size:14 KB



Hi, I've added a test survey, is that right? Please let me know what you think. Thanks again :)
Attachments:

Please Log in to join the conversation.

Start now!

Just create your account and start using Limesurvey today.

Register now
Join our Newsletter!