Back to limesurvey.org

Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

Border for an array question

  • Dede1989
  • Dede1989's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
10 years 10 months ago - 10 years 10 months ago #103738 by Dede1989
Border for an array question was created by Dede1989
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

[img
Last edit: 10 years 10 months ago by Dede1989.
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
10 years 10 months ago #103746 by tpartner
Replied by tpartner on 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:
Code:
<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:
Code:
.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 topic has been locked.
  • Dede1989
  • Dede1989's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
10 years 10 months ago #103751 by Dede1989
Replied by Dede1989 on topic Border for an array question
Thanks alot. If I use your code I get this:

[img
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
10 years 10 months ago #103753 by tpartner
Replied by tpartner on 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.
The topic has been locked.
  • Dede1989
  • Dede1989's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
10 years 10 months ago - 10 years 10 months ago #103754 by Dede1989
Replied by Dede1989 on topic Border for an array question
Testsurvey:

Link
Last edit: 10 years 10 months ago by Dede1989.
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
10 years 10 months ago #103755 by tpartner
Replied by tpartner on topic Border for an array question
For that template, use this script:

Code:
<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 topic has been locked.
  • Dede1989
  • Dede1989's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
10 years 10 months ago #103756 by Dede1989
Replied by Dede1989 on 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?
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
10 years 10 months ago #103757 by tpartner
Replied by tpartner on topic Border for an array question
Modify the CSS snippet I gave you.

Maybe something like:
Code:
.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 topic has been locked.
Moderators: tpartner, holch

Lime-years ahead

Online-surveys for every purse and purpose

Pricing & Plans
Get started

Legal

About Us

Open Source