- Posts: 117
- Thank you received: 9
Welcome to the LimeSurvey Community Forum
Ask the community, share ideas, and connect with other LimeSurvey users!
Hide checkbox but keep label
- paulfiner
- Topic Author
- Offline
- Premium Member
Less
More
3 years 5 months ago #207529
by paulfiner
Hide checkbox but keep label was created by paulfiner
I'm using the multiple-choice with comments type question to try and show some sub-headings.
I've managed to hide the comment boxes but I'm struggling to hide the checkbox on the first row.
I'm using Limesurvey v2.73
Here's my javascript:
Thanks
I've managed to hide the comment boxes but I'm struggling to hide the checkbox on the first row.
I'm using Limesurvey v2.73
Here's my javascript:
Code:
<script type="text/javascript" charset="utf-8"> $(document).ready(function() { var thisQuestion = $('#question{QID}'); // Remove some text inputs $('.checkbox-text-item:eq(0) .comment-container', thisQuestion).remove(); $('input:checkbox:eq(0)', thisQuestion).remove(); <-- This line doesn't work, what do I need? $('.checkbox-text-item:eq(1) .comment-container', thisQuestion).remove(); $('.checkbox-text-item:eq(2) .comment-container', thisQuestion).remove(); $('.checkbox-text-item:eq(3) .comment-container', thisQuestion).remove(); $('.checkbox-text-item:eq(4) .comment-container', thisQuestion).remove();
Thanks
The topic has been locked.
- Joffm
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 12944
- Thank you received: 3979
3 years 5 months ago #207531
by Joffm
Volunteers are not paid.
Not because they are worthless, but because they are priceless
Replied by Joffm on topic Hide checkbox but keep label
Hi,
I have this:
Joffm
I have this:
Code:
<script charset="utf-8" type="text/javascript"> $(document).ready(function() { $( '#question{QID} .question-item:eq(0)').addClass('hide-pseudo-elements').find('input.checkbox').remove(); $( '#question{QID} .question-item:eq(4)').addClass('hide-pseudo-elements').find('input.checkbox').remove(); $( '#question{QID} .question-item:eq(7)').addClass('hide-pseudo-elements').find('input.checkbox').remove(); $( '#question{QID} .question-item:eq(0)').addClass('hide-pseudo-elements').find('.comment-container').remove(); $( '#question{QID} .question-item:eq(4)').addClass('hide-pseudo-elements').find('.comment-container').remove(); $( '#question{QID} .question-item:eq(7)').addClass('hide-pseudo-elements').find('.comment-container').remove(); }); </script>
Code:
<style type="text/css">.hide-pseudo-elements label::before, .hide-pseudo-elements label::after { display: none; } .hide-pseudo-elements .label-text { margin-left: -20px; } </style>
Joffm
Volunteers are not paid.
Not because they are worthless, but because they are priceless
The topic has been locked.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10110
- Thank you received: 3593
3 years 5 months ago #207532
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic Hide checkbox but keep label
The problem is that the labels have pseudo-elements for the checkboxes so you also need to remove those:
Having said that, there is a ton of garbage HTML in that version so I think you would be better off inserting new table rows as the sub-headers:
Sample survey attached:
Code:
<script type="text/javascript" charset="utf-8"> $(document).ready(function() { var thisQuestion = $('#question{QID}'); // Remove a checkbox $('input:checkbox:eq(0)', thisQuestion).remove(); $('td.checkbox:eq(0)', thisQuestion).removeClass('checkbox'); // Remove some text inputs $('.checkbox-text-item:eq(0) .comment-container', thisQuestion).remove(); $('.checkbox-text-item:eq(1) .comment-container', thisQuestion).remove(); $('.checkbox-text-item:eq(2) .comment-container', thisQuestion).remove(); $('.checkbox-text-item:eq(3) .comment-container', thisQuestion).remove(); $('.checkbox-text-item:eq(4) .comment-container', thisQuestion).remove(); }); </script>
Having said that, there is a ton of garbage HTML in that version so I think you would be better off inserting new table rows as the sub-headers:
Code:
<script type="text/javascript" charset="utf-8"> $(document).ready(function() { var thisQuestion = $('#question{QID}'); // Remove some text inputs $('.checkbox-text-item:eq(0) .comment-container', thisQuestion).remove(); $('.checkbox-text-item:eq(1) .comment-container', thisQuestion).remove(); $('.checkbox-text-item:eq(2) .comment-container', thisQuestion).remove(); $('.checkbox-text-item:eq(3) .comment-container', thisQuestion).remove(); // Insert sub-headings $('tr.answer-item:eq(0)', thisQuestion).before('<tr class="inserted-sub-heading"><th colspan=2>Sub-heading 1</th></tr>'); $('tr.answer-item:eq(3)', thisQuestion).before('<tr class="inserted-sub-heading"><th colspan=2>Sub-heading 2</th></tr>'); }); </script>
Sample survey attached:
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
- paulfiner
- Topic Author
- Offline
- Premium Member
Less
More
- Posts: 117
- Thank you received: 9
3 years 5 months ago #207534
by paulfiner
Replied by paulfiner on topic Hide checkbox but keep label
Thanks Tony and Joffm. I went with your last suggestion Tony and it seems to be working fine. I've set up a new server with the latest V3 so I'll slowly be transitioning over to it.
Cheers,
Paul
Cheers,
Paul
The topic has been locked.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10110
- Thank you received: 3593
3 years 5 months ago - 3 years 5 months ago #207536
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic Hide checkbox but keep label
In 3.x, you will need to use something like this:
Code:
<script type="text/javascript" charset="utf-8"> $(document).ready(function() { var thisQuestion = $('#question{QID}'); // Remove some text inputs $('.checkbox-text-item:eq(0) .comment-item', thisQuestion).remove(); $('.checkbox-text-item:eq(1) .comment-item', thisQuestion).remove(); $('.checkbox-text-item:eq(2) .comment-item', thisQuestion).remove(); $('.checkbox-text-item:eq(3) .comment-item', thisQuestion).remove(); // Insert sub-headings $('.checkbox-text-item:eq(0)', thisQuestion).before('<li class="inserted-sub-heading">Sub-heading 1</li>'); $('.checkbox-text-item:eq(3)', thisQuestion).before('<li class="inserted-sub-heading">Sub-heading 2</li>'); }); </script>
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Last edit: 3 years 5 months ago by tpartner.
The topic has been locked.
- paulfiner
- Topic Author
- Offline
- Premium Member
Less
More
- Posts: 117
- Thank you received: 9
3 years 5 months ago #207540
by paulfiner
Replied by paulfiner on topic Hide checkbox but keep label
That's great! I have a feeling I'll have a few more of these upgrade queries over the next few weeks!
Cheers
Cheers
The topic has been locked.