Check out the LimeSurvey source code on GitHub!
Welcome, Guest
Username: Password:

TOPIC: Border for an array question

Border for an array question 2 years 6 months ago #103738

  • Dede1989
  • Dede1989's Avatar
  • Offline
  • Fresh Lemon
  • Posts: 7
  • Karma: 0
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: 2 years 6 months ago by Dede1989.
The administrator has disabled public write access.

Border for an array question 2 years 6 months ago #103746

  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Team
  • Posts: 6122
  • Thank you received: 1358
  • Karma: 534
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.
The administrator has disabled public write access.

Border for an array question 2 years 6 months ago #103751

  • Dede1989
  • Dede1989's Avatar
  • Offline
  • Fresh Lemon
  • Posts: 7
  • Karma: 0
Thanks alot. If I use your code I get this:

The administrator has disabled public write access.

Border for an array question 2 years 6 months ago #103753

  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Team
  • Posts: 6122
  • Thank you received: 1358
  • Karma: 534
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.
The administrator has disabled public write access.

Border for an array question 2 years 6 months ago #103754

  • Dede1989
  • Dede1989's Avatar
  • Offline
  • Fresh Lemon
  • Posts: 7
  • Karma: 0
Testsurvey:

Link
Last Edit: 2 years 6 months ago by Dede1989.
The administrator has disabled public write access.

Border for an array question 2 years 6 months ago #103755

  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Team
  • Posts: 6122
  • Thank you received: 1358
  • Karma: 534
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.
The administrator has disabled public write access.

Border for an array question 2 years 6 months ago #103756

  • Dede1989
  • Dede1989's Avatar
  • Offline
  • Fresh Lemon
  • Posts: 7
  • Karma: 0
Thanks alot. It works fine! Where can I change the border color and thickness to fit for this template?
The administrator has disabled public write access.

Border for an array question 2 years 6 months ago #103757

  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Team
  • Posts: 6122
  • Thank you received: 1358
  • Karma: 534
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.
The administrator has disabled public write access.
Moderators: ITEd
Time to create page: 0.233 seconds
Imprint                   Data Protection Statement                  Revocation information and revocation form