Welcome to the LimeSurvey Community Forum

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

Border for an array question

Dede1989
Topic Author
Offline
New Member

More

10 years 2 months ago - 10 years 2 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

Last edit: 10 years 2 months ago by Dede1989.

The topic has been locked.

tpartner
Offline
LimeSurvey Community Team

More

10 years 2 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
Topic Author
Offline
New Member

More

10 years 2 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:

The topic has been locked.

tpartner
Offline
LimeSurvey Community Team

More

10 years 2 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
Topic Author
Offline
New Member

More

10 years 2 months ago - 10 years 2 months ago #103754 by Dede1989

Replied by Dede1989 on topic Border for an array question

Testsurvey:

Link

Last edit: 10 years 2 months ago by Dede1989.

The topic has been locked.

tpartner
Offline
LimeSurvey Community Team

More

10 years 2 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
Topic Author
Offline
New Member

More

10 years 2 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
Offline
LimeSurvey Community Team

More

10 years 2 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.

Lime-years ahead

Online-surveys for every purse and purpose

Pricing & Plans

Get started

Welcome to the LimeSurvey Community Forum

Border for an array question

Lime-years ahead

Legal

About Us

Open Source