border around 3 questions

More
4 years 8 months ago #92313 by adishardis
adishardis created the topic: border around 3 questions
Hi, I have a client that insists on a multiple choice question, with the choices in columns.

What I did was to divide the question into two multiple choice and float them to make them sit beside eachother and actually a third above them with description, like this:

(I added the border in the picture in photoshop to clarify what I'm after :)



Now they insist on having a border around them but I dont know how to make this. I would like a wrapping div and set border:solid 2 green, but since they are three seperate questions I'm stumped.

In this group there are questions above and depending on the choice made above there can be more questions below these three...

Any insight next couple of hours would be swell, any help to get me going in the right direction would be greatly appreciated!

Take care
Adam
Attachments:

Please Log in to join the conversation.

More
4 years 8 months ago #92387 by tpartner
tpartner replied the topic: border around 3 questions
Add the following script to the source of the first question. It will wrap it and the next question in a <div class="insertedWrapperDiv"> element.
<script type="text/javascript" charset="utf-8">
	$(document).ready(function(){
 
		// Add a class to this and the next question
		$('#question{QID}').addClass('divWrapped');
		$('#question{QID}').nextAll('div[id^="question"]:eq(0)').addClass('divWrapped');
 
		// Wrap the two questions in a div
		$('.divWrapped').wrapAll('<div class="insertedWrapperDiv" />');
 
	});
</script>

And then add something like this to the end of template.css to style the div:
.insertedWrapperDiv {
	border: 2px solid green;
}

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
4 years 8 months ago #92388 by tpartner
tpartner replied the topic: border around 3 questions
Sorry, I missed the bit about the third question. Use this script for 3 questions:
<script type="text/javascript" charset="utf-8">
	$(document).ready(function(){
 
		// Add a class to this and the next 2 questions
		$('#question{QID}').addClass('divWrapped');
		$('#question{QID}').nextAll('div[id^="question"]:eq(0)').addClass('divWrapped');
		$('#question{QID}').nextAll('div[id^="question"]:eq(1)').addClass('divWrapped');
 
		// Wrap the three questions in a div
		$('.divWrapped').wrapAll('<div class="insertedWrapperDiv" />');
 
	});
</script>

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: adishardis

Please Log in to join the conversation.

More
4 years 8 months ago #92391 by adishardis
adishardis replied the topic: border around 3 questions
Thanks, you're a star!! :)

Please Log in to join the conversation.

Start now!

Just create your account and start using Limesurvey today.

Register now