Border for an array question

More
3 years 4 months ago - 3 years 4 months ago #103738 by Dede1989
Dede1989 created the topic: Border for an array question
Hello guys,

I want to add a visual separator for my array question e.g. a black border or space between two answering options. I attach a screenshot which should clarify what i want to realize. Maybe somebody can help me?

Dede1989

Last Edit: 3 years 4 months ago by Dede1989.

Please Log in to join the conversation.

More
3 years 4 months ago #103746 by tpartner
tpartner replied the topic: Border for an array question
You will need to insert a new column with JavaScript and style it with CSS.

Add this script to the question source:
<script type="text/javascript" charset="utf-8">	
 
	$(document).ready(function() {
 
		var newColPosition = 6;
 
		// Identify this question ID
		var qID = {QID};
 
		// Insert a new column
		$('#question'+qID+' table.question col:eq('+(newColPosition-1)+')', this).after('<col class="inserted-column" />');
		$('#question'+qID+' table.question thead th:eq('+(newColPosition-2)+')', this).after('<th class="inserted-column" />');
		$('#question'+qID+' table.question tbody tr').each(function(i) {
			$('td:eq('+(newColPosition-2)+')', this).after('<td class="inserted-column" />');
		});
	});
 
</script>


2) Add something like this to the end of template.css:
.inserted-column {
	padding: 1px !important;
	background-color: #000000 !important;
}

.

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
3 years 4 months ago #103751 by Dede1989
Dede1989 replied the topic: Border for an array question
Thanks alot. If I use your code I get this:

Please Log in to join the conversation.

More
3 years 4 months ago #103753 by tpartner
tpartner replied the topic: Border for an array question
Can you activate a test survey so I can see the source?

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
3 years 4 months ago - 3 years 4 months ago #103754 by Dede1989
Dede1989 replied the topic: Border for an array question
Testsurvey:

Link
Last Edit: 3 years 4 months ago by Dede1989.

Please Log in to join the conversation.

More
3 years 4 months ago #103755 by tpartner
tpartner replied the topic: Border for an array question
For that template, use this script:

<script type="text/javascript" charset="utf-8">	
 
	$(document).ready(function() {
 
		var newColPosition = 6;
 
		// Identify this question ID
		var qID = {QID};
 
		// Insert a new column
		$('#question'+qID+' table.question.subquestions-list col:eq('+(newColPosition-1)+')', this).after('<col class="inserted-column" />');
		$('#question'+qID+' table.question.subquestions-list thead th:eq('+(newColPosition-2)+')', this).after('<th class="inserted-column" />');
		$('#question'+qID+' table.question.subquestions-list tbody tr').each(function(i) {
			$('td:eq('+(newColPosition-2)+')', this).after('<td class="inserted-column" />');
		});
	});
 
</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
3 years 4 months ago #103756 by Dede1989
Dede1989 replied the topic: Border for an array question
Thanks alot. It works fine! Where can I change the border color and thickness to fit for this template?

Please Log in to join the conversation.

More
3 years 4 months ago #103757 by tpartner
tpartner replied the topic: Border for an array question
Modify the CSS snippet I gave you.

Maybe something like:
.inserted-column {
	padding: 4px !important;
	background-color: #999999!important;
}

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.

Start now!

Just create your account and start using Limesurvey today.

Register now